Selektor (CSS)
Ein CSS-Selektor ist der Teil einer CSS-Regel, der beschreibt, welche Elemente in einem Dokument mit der Regel übereinstimmen. Die übereinstimmenden Elemente erhalten den in der Regel angegebenen Stil.
Beispiel
Betrachten Sie dieses CSS:
p {
color: green;
}
div.warning {
width: 100%;
border: 2px solid yellow;
color: white;
background-color: darkred;
padding: 0.8em 0.8em 0.6em;
}
#customized {
font:
16px "Lucida Grande",
"Helvetica",
"Arial",
sans-serif;
}
Die Selektoren hier sind "p"
(welcher die Farbe Grün auf den Text innerhalb eines <p>
-Elements anwendet), "div.warning"
(welches jedes <div>
-Element mit der class "warning"
wie ein Warnfeld aussehen lässt), und "#customized"
, welches die Basis-Schriftart des Elements mit der ID "customized"
auf eine 16-Pixel hohe Lucida Grande oder eine der anderen angegebenen Ersatzschriften setzt.
Wir können dieses CSS dann auf etwas HTML anwenden, wie zum Beispiel:
<p>This is happy text.</p>
<div class="warning">
Be careful! There are wizards present, and they are quick to anger!
</div>
<div id="customized">
<p>This is happy text.</p>
<div class="warning">
Be careful! There are wizards present, and they are quick to anger!
</div>
</div>
Der resultierende Seiteninhalt wird folgendermaßen gestylt:
Siehe auch
-
Erfahren Sie mehr über CSS-Selektoren in unserer Einführung in CSS.
-
Grundlegende Selektoren
- Elementselektoren
elementname
- Klassenselektoren
.classname
- ID-Selektoren
#idname
- Universalselektoren
* ns|* *|*
- Attributselektoren
[attr=value]
- Zustandsselektoren
a:active, a:visited
- Elementselektoren
-
Gruppierungsselektoren
- Selektorenliste
A, B
- Selektorenliste
-
Kombinatoren
-
Pseudo