Nachfahrkombinator
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Der Nachfahrkombinator — typischerweise durch ein einzelnes Leerzeichen (" ") dargestellt — kombiniert zwei Selektoren so, dass Elemente, die dem zweiten Selektor entsprechen, ausgewählt werden, wenn sie ein Vorfahrelement (Elternteil, Elternteil des Elternteils, Elternteil des Elternteils des Elternteils usw.) haben, das dem ersten Selektor entspricht. Selektoren, die einen Nachfahrkombinator nutzen, werden Nachfahrselektoren genannt.
/* List items that are descendants of the "my-things" list */
ul.my-things li {
margin: 2em;
}
Der Nachfahrkombinator besteht technisch aus einem oder mehreren CSS-Leerzeichen — dem Leerzeichen und/oder einem von vier Steuerzeichen: Wagenrücklauf, Formularvorschub, neue Zeile und Tabulatorzeichen — zwischen zwei Selektoren in Abwesenheit eines anderen Kombinators. Darüber hinaus können die Leerzeichen, aus denen der Kombinator besteht, beliebig viele CSS-Kommentare enthalten.
Syntax
selector1 selector2 {
/* property declarations */
}
Beispiele
CSS
li {
list-style-type: disc;
}
li li {
list-style-type: circle;
}
HTML
<ul>
<li>
<div>Item 1</div>
<ul>
<li>Subitem A</li>
<li>Subitem B</li>
</ul>
</li>
<li>
<div>Item 2</div>
<ul>
<li>Subitem A</li>
<li>Subitem B</li>
</ul>
</li>
</ul>
Ergebnis
Spezifikationen
| Specification |
|---|
| Selectors Level 4 # descendant-combinators |