Descendent - CSS-Tricks

Anonim

Un selector descendent în CSS este orice selector cu spațiu alb între doi selectori fără un combinator. Iată câteva exemple:

ul li ( ) header h2 ( ) footer a ( ) .module div ( ) #info-toggle span ( ) div dl dt a ( )

Să luăm ul li ( )de exemplu. Înseamnă „orice element de listă care este un descendent al unei liste neordonate”.

Descendent înseamnă oriunde cuibărit în el în arborele DOM. Ar putea fi un copil direct, ar putea avea cinci niveluri adâncime, este încă un descendent. Acest lucru este diferit de un combinator copil (>) care necesită ca elementul să fie următorul nivel imbricat în jos.

Pentru a ilustra, se div span ( )va potrivi:

 I will match
  • I will match too

Probabil că nu ar trebui să vă faceți griji prea mult, dar selectorul decedat este destul de „scump” - adică greu / lent pentru motoarele de redare pentru a afla și a face lucruri cu. MDN:

Selectorul descendent este cel mai scump selector din CSS. Este îngrozitor de scump - mai ales dacă selectorul se află în categoria Tag sau Universal.

Dar numai în comparație cu alți selectori. Este încă extrem de rapid și probabil că nu veți observa niciodată acest lucru, cu excepția cazului în care înnebuniți.

Suport pentru browser

Crom Safari Firefox Operă IE Android iOS
Orice Orice Orice Orice Orice Orice Orice