CSS/Selektoren/Kombinator/Nachfahrenselektor

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Werden zwei einfache Selektoren durch ein Leerzeichen („ “) miteinander verbunden, z.B. „E F“, so wird das Element F nur dann angesprochen, wenn es Nachfahre eines E-Elements ist.

  • CSS 1.0
  • Chrome
  • Firefox
  • IE
  • Opera
  • Safari

Das Leerzeichen (bzw. ein anderes Whitespace-Zeichen) zwischen zwei Selektoren dient nur dann als Kombinator, wenn kein anderer Kombinator vorhanden ist.

Beispiel ansehen …
p em {
   color: green;
   padding: border: 1px solid;	
   background-color: #fffbf0;
   font-style: italic; 
}
Stilfestlegung für em-Elemente, die Nachfahrenelemente von p sind.
<h2>Der <em>Kind</em>selektor</h2> <p> <em>Dieses</em> Beispiel demonstriert die Wirkung des <del>Nachbar</del><ins><em>Nachfahren</em></ins>selektors. </p>
In diesem Beispiel werden die beiden em-Elemente innerhalb des Absatzes mit grüner Schriftfarbe dargestellt, da es sich bei beiden um ein Nachfahrenelement des p-Elements handelt. Das em-Element innerhalb der Überschrift ist davon unabhängig und wird nicht weiter berücksichtigt.