Desafío: Práctica de Pseudo-Clases Estructurales
Tarea
Estamos trabajando con un conjunto de elementos y el objetivo es practicar la aplicación de diferentes colores utilizando pseudo-clases estructurales. Su tarea es la siguiente:
- Aplicar el color
redal primer elemento utilizando una pseudo-clase estructural. - Aplicar el color
blueal último elemento utilizando una pseudo-clase estructural. - Aplicar el color
greena cada segundo elemento utilizando una pseudo-clase estructural.
index.html
index.css
:first-child: Selecciona el primer hijo de un elemento padre.:last-child: Selecciona el último hijo de un elemento padre.:nth-child(): Selecciona un hijo específico de un elemento padre según su posición en la lista. Por ejemplo, para seleccionar cada segundo elemento de la lista (2, 4, 6, etc.), puede usar:nth-child(2n).
index.html
index.css
¡Gracias por tus comentarios!
Pregunte a AI
Pregunte a AI
Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla
Can you show me an example of how to use these pseudo-classes in CSS?
What kind of elements are we applying these styles to?
Can you explain how :nth-child(2n) works in more detail?
Awesome!
Completion rate improved to 2.56Desafío: Práctica de Pseudo-Clases Estructurales
Desliza para mostrar el menú
Tarea
Estamos trabajando con un conjunto de elementos y el objetivo es practicar la aplicación de diferentes colores utilizando pseudo-clases estructurales. Su tarea es la siguiente:
- Aplicar el color
redal primer elemento utilizando una pseudo-clase estructural. - Aplicar el color
blueal último elemento utilizando una pseudo-clase estructural. - Aplicar el color
greena cada segundo elemento utilizando una pseudo-clase estructural.
index.html
index.css
:first-child: Selecciona el primer hijo de un elemento padre.:last-child: Selecciona el último hijo de un elemento padre.:nth-child(): Selecciona un hijo específico de un elemento padre según su posición en la lista. Por ejemplo, para seleccionar cada segundo elemento de la lista (2, 4, 6, etc.), puede usar:nth-child(2n).
index.html
index.css
¡Gracias por tus comentarios!
