Permite seleccionar elementos que se encuentran dentro de otros elementos, por ejemplo:
p h1 {color: red; }:Se aplicará a todas las etiquetas h1 que estén dentro de bloques p. Además hay que tener en cuenta que:
- No tiene porqué ser descendiente directo.
- El nivel de anidación puede tener varios niveles, por ejemplo:
p a b i {text-decoration: underline; }Se aplica a los elementos en cursiva, dentro de etiquetas de negrita, anidados dentro de enlaces que se encuentren en párrafos.
Es importante tener en cuenta que si no tenemos cuidado podemos confundir el selector descendente con la aplicación del mismo selector a distintas etiquetas
p a b i {color: blue; } ¡NO ES LO MISMO QUE...!
p,a,b,i {color: blue;}También podemos combinar el selector universal con selectores descendentes, por ejemplo:
p * b {color: #0000FF;}Se aplica a todas las etiquetas de tipo <b> que estén anidadas en cualquier otra etiqueta que a su vez esté dentro de una etiqueta de tipo <p>.
Sin embargo no se aplicará a las etiquetas de tipo <b> que estén dentro de una etiqueta de tipo <p> directamente.