English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS Referenzhandbuch

CSS @Regel (RULES)

Vollständiges Verzeichnis der CSS-Eigenschaften

CSS > Kindselektor

Wenn Sie zwei Elemente mit dem >-Selektor trennen, wird er nur die Elemente auswählen, die als direkte Nachkommen des ersten Elements (Kindelemente) der zweiten Elemente sind. Im Gegensatz dazu bedeutet es, wenn zwei Elemente durch einen NachkommenSelektor verbunden sind, dass alle Elemente, die als Vorelemente des ersten Elements (nicht unbedingt Elternelemente) existieren, gematcht werden, unabhängig davon, wie oft sie im DOM "springen".

Vollständiges Referenzhandbuch für CSS-Selektoren

Online-Beispiel

Wählen Sie alle <p>-Elemente aus, die Elternelemente sind <div>-Elemente:

<!DOCTYPE html>
<html>
<title>Grundlagen-Tutorial-Website (oldtoolbag.com)</title>
<head>
<style>
div>p
{
background-color:red;
color:white;
}
div > span {background-color: DodgerBlue;}
</style>
</head>
<body>
<h1>Willkommen auf der Grundlagen-Tutorial-Website (de.oldtoolbag.com)</h1>
<div>
<p>Unsere Website-Adresse ist: de.oldtoolbag.com.</p>
<p>Der Name unserer Website ist: Grundlagen-Tutorial-Website.</p>
<span>Zeige den Kindselektor</span>
</div>
<p>Wir bieten Ihnen verschiedene grundlegende Tutorials an, lernen Sie die Grundlagen, dann können Sie weitergehen! </p>
</body>
</html>
Testen Sie es heraus ‹/›

Definition und Verwendung

Element1 > Element2 {Stildeklaration}

element>element Der Kindselektor wird verwendet, um spezifische Elternelemente auszuwählen.

Beachten Sie: Ein Element kann nicht direkt den Kindelement des Elternelements angegeben werden, wenn es nicht ausgewählt ist.

Browserkompatibilität

IEFirefoxOperaChromeSafari

Alle gängigen Browser unterstützen element>element Kindselektor.

Beachten Sie:element>elementin IE8Um in HTML <!DOCTYPE>

Vollständiges Referenzhandbuch für CSS-Selektoren