Pseudo-clases

Pseudo-clases estructurales

La pseudo-clase :nth-of-type

La pseudo-clase :nth-of-type() de CSS selecciona uno o más elementos de un tipo dado, en función de su posición entre un grupo de hermanos.

Valor entero

Representa al elemento <p> indicado por el valor numérico.

Párrafo 1

Este es un <div> y no se cuenta.

Párrafo 2

Párrafo 3

Este es un <div> y no se cuenta.

Párrafo 4

Párrafo 5

Palabra clave odd

Representa los elementos <p> cuya posición numérica en una serie de hermanos es impar: 1, 3, 5, etc.

Párrafo 1

Este es un <div> y no se cuenta.

Párrafo 2

Párrafo 3

Este es un <div> y no se cuenta.

Párrafo 4

Párrafo 5

Palabra clave even

Representa los elementos <p> cuya posición numérica en una serie de hermanos es par: 2, 4, 6, etc.

Párrafo 1

Este es un <div> y no se cuenta.

Párrafo 2

Párrafo 3

Este es un <div> y no se cuenta.

Párrafo 4

Párrafo 5

Notación funcional (An+B)

Representa los elementos <p> cuya posición numérica en una serie de hermanos coincide con el patrón An+B, para cada entero positivo mayor o igual que cero.

Párrafo 1

Este es un <div> y no se cuenta.

Párrafo 2

Párrafo 3

Este es un <div> y no se cuenta.

Párrafo 4

Párrafo 5

La pseudo-clase :nth-last-of-type

La pseudo-clase :nth-last-of-type() de CSS selecciona uno o más elementos en función de su posición entre un grupo de hermanos, contando desde el final.

:nth-last-of-type se comporta como :nth-of-type salvo que empieza a contar desde el último hermano. También dispone de las palabras clave odd y even así como de la notación funcional (An+B).