Nachkomme - CSS-Tricks | CSS-Almanach 2025

Ein Nachkommen-Selektor in CSS ist ein beliebiger Selektor mit Leerraum zwischen zwei Selektoren ohne Kombinator. Hier einige Beispiele:

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

Nehmen Sie ul li ( )zum Beispiel. Es bedeutet "jedes Listenelement, das ein Nachkomme einer ungeordneten Liste ist".

Nachkomme bedeutet irgendwo im DOM-Baum verschachtelt. Könnte ein direktes Kind sein, könnte fünf Ebenen tief sein, es ist immer noch ein Nachkomme. Dies unterscheidet sich von einem untergeordneten Kombinator (>), bei dem das Element die nächste verschachtelte Ebene nach unten sein muss.

Zur Veranschaulichung div span ( )wird übereinstimmen:

 I will match

I will match too

Sie sollten sich wahrscheinlich keine großen Sorgen machen, aber der dekentente Selektor ist ziemlich "teuer" - was bedeutet, dass es für Rendering-Engines schwierig / langsam ist, herauszufinden und Dinge damit zu tun. MDN:

Der Nachkommen-Selektor ist der teuerste Selektor in CSS. Es ist furchtbar teuer - besonders wenn sich der Selektor in der Kategorie Tag oder Universal befindet.

Aber nur im Vergleich zu anderen Selektoren. Es ist immer noch unglaublich schnell und Sie werden es wahrscheinlich nie bemerken, wenn Sie nicht verrückt werden.