CSS3: nth-child selector ()
selectores CSS completo manual de referencia
Ejemplos
Describir cada elemento p coincide con el color de fondo del elemento padre de la segunda sub-elemento:
p:nth-child(2)
{
background:#ff0000;
}
{
background:#ff0000;
}
Trate »
Definición y Uso
: Nth-child (n) Selector de búsqueda de elemento padre enésimo elemento.
npuede ser un número, una palabra clave o una fórmula.
Consejo: Ver Selector .El selector coincide con el mismo tipo de los hermanos entre hermanos n-ésimo.
Soporte para el navegador
Las cifras de la tabla representan el primer navegador compatible con el número de versión de la propiedad.
选择器 | |||||
---|---|---|---|---|---|
:nth-child() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
más ejemplos
Ejemplo 1
<P pares e impares se puede utilizar como una palabra clave para que coincida con el sub-elemento se utiliza, su índice es par o impar (el índice del primer hijo es 1). A continuación, especificamos dos diferentes colores de fondo para los elementos pares e impares p:
p:nth-child(odd)
{
background:#ff0000;
}
p:nth-child(even)
{
background:#0000ff;
}
{
background:#ff0000;
}
p:nth-child(even)
{
background:#0000ff;
}
Trate »
Ejemplo 2
Utilizando la fórmula (a + b) Descripción: El tamaño de un representante de un ciclo, N es un contador (comenzando en 0), y b es el desplazamiento. Aquí todos los índices son múltiplos de tres elementos P especifica el color de fondo:
p:nth-child(3n+0)
{
background:#ff0000;
}
{
background:#ff0000;
}
Trate »