Curso de CSS
Dale estilo y vida a la web.
Aprende CSS con ejemplos interactivos y crea proyectos reales.
Puedes combinar selectores para ser más específico: descendientes, hijos directos, o varios selectores que comparten el mismo estilo.
Explicación
Combinar selectores te permite apuntar con más precisión dentro de una estructura HTML:
A BSelector descendiente: selecciona B en cualquier nivel dentro de A.
A > BSelector de hijo directo: selecciona B solo si es hijo inmediato de A.
A, BSelector de grupo: aplica el mismo estilo a A y a B, sin relación entre ellos.
Reto rápido
Agrega una regla que solo afecte a los párrafos que están fuera de la tarjeta.
En esta lección
- Ejemplo interactivo
- Explicación de cada etiqueta
- Cuándo usarlo
- Errores comunes
Consejo
El selector descendiente (con solo un espacio) es el que más vas a usar para aplicar estilos "dentro de" un contenedor.
Dato extra
Existen más combinadores, como el selector de hermano adyacente (A + B) y el general (A ~ B), útiles para casos más avanzados de diseño.
Error común
Confundir "A B" (cualquier descendiente) con "A > B" (solo hijo directo): un selector demasiado amplio puede estilizar elementos que no querías tocar.
Siguiente paso
Con selectores precisos ya puedes apuntar a casi cualquier parte del HTML. Ahora enfoquémonos en darle color y tipografía al texto.
Ir a la siguiente lección