Verschiedene Optionen
Selector Combinations
Es gibt verschiedene Optionen, wie man Selektoren miteinander kombiniert, respektive unter welchen Umständen ein Rule-Set zum Einsatz kommt.
Die Möglichkeiten, wie CSS Selektoren kombiniert werden können, sind sehr breit. Wer mit CSS arbeitet, der tut sich gut, gewisse Kombinationen zu kennen. Beispielsweise kann man auch :not Selektoren nutzen, um gewisse Kombinationen auszuschliessen.
Im Bild werden vier Möglichkeiten gezeigt. Es sind alles Beispiele, die auch anders kombiniert werden können.
Nested Selector
Mit einem Leerschlag, werden Selektoren verschachtelt miteinander kombiniert. Beispielsweise: Wähle alle ::hover (State) innerhalb .titel-500 (Class) innerhalb einer h2 (HTML-Element) aus.
Packet Selector
Mit einem Komma trennt man verschiedenen Selektoren voneinander ab, die aber alle das gleiche Rule-Set erhalten sollen.
Child Selector
Mit einem Bracket > (rechte eckige Klammer) wird ein Rule-Set nur für Child-Elemente eines definierten Parents definiert.
Sibling Selector
Mit einem Plus-Zeichen + werden Elemente angesprochen, die auf gleicher Stufe stehen. Siblings = Geschwister.