Nachfahre

Ein Nachkomme-Selektor in CSS ist jeder Selektor, bei dem ein Leerzeichen zwischen zwei Selektoren ohne Kombinator steht. Hier sind einige Beispiele.

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

Nehmen wir zum Beispiel ul li { }. Das bedeutet „jedes Listenelement, das ein Nachkomme einer unsortierten Liste ist.“

Nachkomme bedeutet überall innerhalb des DOM-Baums verschachtelt. Es kann ein direktes Kind sein, es kann fünf Ebenen tief sein, es ist immer noch ein Nachkomme. Das unterscheidet sich von einem Kind-Kombinator (>), der erfordert, dass das Element die nächste verschachtelte Ebene darunter ist.

Zur Veranschaulichung wird div span { } übereinstimmen

<div>
  <span>I will match</span>
  <ul>
    <li>
       <span>I will match too</span>
    </li>
  </ul>
</div>

Sie sollten sich wahrscheinlich nicht allzu viele Gedanken darüber machen, aber der Nachkomme-Selektor ist ziemlich „teuer“ – das bedeutet, dass Rendering-Engines ihn nur schwer/langsam erkennen und damit etwas tun können. MDN:

Der Nachkomme-Selektor ist der teuerste Selektor in CSS. Er ist schrecklich teuer – insbesondere wenn der Selektor in der Kategorie Tag oder Universal ist.

Aber nur im Vergleich zu anderen Selektoren. Er ist immer noch blitzschnell und Sie werden ihn wahrscheinlich nie bemerken, es sei denn, Sie werden verrückt.

Browser-Unterstützung

Chrome	Safari	Firefox	Opera	IE	Android	iOS
Alle	Alle	Alle	Alle	Alle	Alle	Alle