CSS . Klassenselektor _
Beispiel
Alle Elemente mit class="intro" auswählen und stylen:
.intro {
background-color: yellow;
}
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Der .class
Selektor wählt Elemente mit einem bestimmten Klassenattribut aus.
Um Elemente mit einer bestimmten Klasse auszuwählen, schreiben Sie einen Punkt (.) gefolgt vom Namen der Klasse.
Sie können auch angeben, dass nur bestimmte HTML-Elemente von einer Klasse betroffen sein sollen. Beginnen Sie dazu mit dem Elementnamen, schreiben Sie dann den Punkt (.) gefolgt vom Namen der Klasse (siehe Beispiel 1 unten).
HTML-Elemente können auch auf mehr als eine Klasse verweisen (siehe Beispiel 2 unten).
Ausführung: | CSS1 |
---|
Browser-Unterstützung
Selector | |||||
---|---|---|---|---|---|
.class | Yes | Yes | Yes | Yes | Yes |
CSS-Syntax
.class {
css declarations;
}
Mehr Beispiele
Beispiel 1
Gestalten Sie alle <p>-Elemente mit class="hometown":
p.hometown {
background-color: yellow;
}
Beispiel 2
Dieses <p>-Element wird entsprechend class="center" UND class="large" gestylt:
<p class="center large">This paragraph refers to two classes.</p>