Der Geschwisterselektor, geschrieben mit Plus oder Tilde, wählt Elemente aus, die neben einem anderen stehen, also auf derselben Ebene und danach.
- Geschwisterselektor
Kombinator aus Plus oder Tilde, der Elemente auf derselben Ebene nach einem anderen auswählt.
Beispiel: „Der Geschwisterselektor greift nur nach vorn, nie zurück.“
Die beiden Zeichen
h2 + p /* der Absatz direkt nach der Überschrift */
h2 ~ p /* jeder Absatz danach, gleiche Ebene */Das Plus meint genau das nächste Element, die Tilde alle folgenden. Beide bleiben auf einer Ebene: Was in einem Kasten daneben steckt, erreichen sie nicht. Dafür ist der Nachfahrenselektor da.
Wofür der Geschwisterselektor im Alltag taugt
Für Abstände zwischen zwei Elementen, die aufeinanderfolgen. Ein Absatz direkt nach einer Überschrift braucht oben weniger Luft, und genau dieser Fall lässt sich ohne eigene Klasse beschreiben.
Rückwärts geht nicht
Es gibt kein Zeichen für davor. Wer das Element vor einem anderen braucht, dreht die Regel um oder nimmt die Pseudoklasse :has().