Un selector descendiente en CSS es cualquier selector con espacios en blanco entre dos selectores sin un combinador. He aquí algunos ejemplos:
ul li ( ) header h2 ( ) footer a ( ) .module div ( ) #info-toggle span ( ) div dl dt a ( )Tomemos ul li ( )por ejemplo. Significa "cualquier elemento de la lista que sea descendiente de una lista desordenada".
Descendiente significa cualquier lugar anidado dentro de él en el árbol DOM. Podría ser un hijo directo, podría tener cinco niveles de profundidad, todavía es un descendiente. Esto es diferente a un combinador hijo (>) que requiere que el elemento sea el siguiente nivel anidado hacia abajo.
Para ilustrar, div span ( )coincidirá:
I will match
- I will match too
Probablemente no debería preocuparse mucho por eso, pero el selector difunto es bastante "caro", es decir, difícil / lento para que los motores de renderización lo averigüen y hagan cosas con él. MDN:
El selector descendiente es el selector más caro de CSS. Es terriblemente caro, especialmente si el selector está en la categoría Etiqueta o Universal.
Pero solo en comparación con otros selectores. Sigue siendo increíblemente rápido y probablemente nunca lo notarás a menos que te vuelvas loco.
Soporte del navegador
| Cromo | Safari | Firefox | Ópera | ES DECIR | Androide | iOS |
|---|---|---|---|---|---|---|
| Alguna | Alguna | Alguna | Alguna | Alguna | Alguna | Alguna |