CSS Reference Manual

CSS @rules (RULES)

Complete List of CSS Attributes

CSS-Funktionen (Functions)CSS-Selektor大全

CSS + Adjazenzschwestern-Selektoren

Adjazenzschwestern-Selektoren (+) Zwischen zwei Selektoren, wenn das zweite Element direkt nach dem ersten Element folgt und beide Elemente demselben Elternteil gehören, wird das zweite Element ausgewählt.

Vollständiges Referenzhandbuch für CSS-Selektoren

Online-Beispiel

Wählen Sie alle <p> und den ersten <span> nachfolgenden <div>-Elementen aus:

Beispiel

<!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 Adjazenzschwestern-Selektoren</span>
<span>Zeige Adjazenzschwestern-Selektoren</span>
</div>
<p>Wir bieten Ihnen verschiedene Grundlagen-Tutorials an, lernen Sie die Grundlagen gut, dann können Sie weitergehen! </p>
</body>
</html>

Testen Sie es heraus ‹/›

Definition und Verwendung

former_element　+　target_element　{　style　properties　}

element+element　 Adjazenzschwestern-Selektoren werden verwendet, um den ersten Element, der direkt nach dem angegebenen Element folgt (nicht intern), auszuwählen.

Browserkompatibilität

IEFirefoxOperaChromeSafari

Wird von allen gängigen Browsern unterstützt element+element Adjazenzschwestern-Selektoren

Beachten Sie: 　element+elementin IE8Um in HTML5 zu funktionieren, muss es deklariert werden 　<!DOCTYPE>Vollständiges Referenzhandbuch für CSS-Selektoren

CSS-Funktionen (Functions)CSS-Selektor大全