Was sind relationale Selektoren?

Zu den relationalen Selektoren gehören „Nachkommen-Selektor“, „Selektor für untergeordnete Elemente“, „Selektor für benachbarte Geschwister“ und „Universal-Selektor für Geschwister“: 1. Der Selektor für untergeordnete Elemente wählt Elemente über ihre Nachkommenbeziehung aus. 2. Der Selektor für untergeordnete Elemente wählt Elemente über die Beziehung des Elements aus 3. Benachbarter Geschwister-Selektor, wählt Elemente über die benachbarte Geschwister-Beziehung des Elements aus. 4. Universeller Geschwister-Selektor, wählt Elemente über die Geschwister-Beziehung des Elements aus.

Das Betriebssystem dieses Tutorials: Windows 10-System, Dell G3-Computer.

Relationale Selektoren werden verwendet, um Beziehungen zwischen Elementen auszuwählen. Im Folgenden sind einige gängige relationale Selektoren aufgeführt:

1. Nachkommenselektor: Wählen Sie Elemente anhand ihrer Nachkommenbeziehungen aus.

div p {  
color: blue;
}

Im obigen Beispiel werden alle

-Elemente ausgewählt, die sich innerhalb von

-Elementen befinden, und die Textfarbe wird auf Blau gesetzt.

2. Untergeordneter Selektor: Wählen Sie Elemente anhand ihrer Eltern-Kind-Beziehung aus.

div > p {  
font-weight: bold;
}

Im obigen Beispiel werden alle

-Elemente direkt innerhalb des

-Elements ausgewählt und die Schriftart wird fett dargestellt.

3. Angrenzende Geschwisterauswahl: Wählen Sie Elemente basierend auf ihrer benachbarten Geschwisterbeziehung aus.

h1 + p {  
color: red;
}

Im obigen Beispiel wird das

-Element direkt nach dem

-Element ausgewählt und die Textfarbe auf Rot gesetzt.

4. Allgemeine Geschwisterauswahl: Wählen Sie Elemente anhand ihrer Geschwisterbeziehung aus.

h1 ~ p {  
font-style: italic;
}

Im obigen Beispiel werden alle

-Elemente ausgewählt, die sich nach dem

-Element befinden, und der Schriftstil wird auf kursiv gesetzt.

Diese relationalen Selektoren können uns helfen, Elemente genauer auszuwählen und Stile basierend auf der spezifischen Beziehung zwischen ihnen anzuwenden. Durch den rationalen Einsatz relationaler Selektoren können wir den Stil der Elemente auf der Seite flexibel steuern.

Das obige ist der detaillierte Inhalt vonWas sind relationale Selektoren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!