Descripción
La pseudo-clase :nth-child() de CSS se utiliza para seleccionar uno o más elementos en función de su posición entre un grupo de elementos hermanos. Permite estilizar elementos específicos basándose en su índice en el grupo.
Sintaxis
La sintaxis general de la pseudo-clase :nth-child() es la siguiente:
elemento:nth-child(n) { propiedades CSS }
Valores
- n, número entero que representa la posición del elemento que se desea seleccionar en el grupo de elementos hermanos. Por ejemplo, si ‘n’ es 3, la pseudo-clase
:nth-child()seleccionará el tercer elemento en el grupo.
Ejemplo
Aquí tienes un ejemplo de cómo usar :nth-child() para seleccionar y estilizar el tercer elemento ‘li’ en una lista:
li:nth-child(3) {
color: red;
}
En este caso, el tercer elemento ‘li’ del grupo se mostrará en rojo.
