Heim >Web-Frontend >CSS-Tutorial >Wie wähle ich in CSS ein Element direkt vor einem anderen Element aus?
Den Unterschied zwischen div p und div ~ p verstehen
In CSS-Selektoren wählen sowohl der Plus- ( ) als auch der Tilde-Operator (~) aus Geschwisterelemente eines angegebenen Elements. Ihr Verhalten unterscheidet sich jedoch je nach Position des Elements relativ zu seinem Geschwister.
div p (Adjacent Sibling Selector)
Dieser Selektor entspricht allen
Elemente, die unmittelbar nach einem
div + p { color: red; }
In diesem Fall wird nur der erste Absatz, der auf jedes
div ~ p (Allgemeiner Geschwisterselektor)
Dieser Selektor entspricht allen
Elemente, denen ein
div ~ p { color: blue; }
In diesem Fall werden alle Absätze, die nach einem
Klärung der Frage
Die Frage fragt nach einem Selektor, der ein Element auswählt, das unmittelbar vor einem bestimmten Element platziert wird. Dies kann mit den Selektoren div p oder div ~ p nicht erreicht werden.
Angrenzender Geschwisterselektor für vorhergehende Elemente
Um ein Element auszuwählen, das unmittelbar vor einem anderen Element liegt, müssen Sie kann den benachbarten Geschwisterselektor in umgekehrter Reihenfolge verwenden:
X Y
In dieser Syntax ist X das vorhergehende Element und Y ist das Thema des Selektors. Zum Beispiel:
p + ul { color: green; }
Dieser Selektor wendet grünen Text nur auf die erste ungeordnete Liste nach jedem Absatz an.
Das obige ist der detaillierte Inhalt vonWie wähle ich in CSS ein Element direkt vor einem anderen Element aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!