Klassen

Eine Klasse ist in CSS einfach gesagt eine Gruppierung von Eigenschaften, die einmal definiert wird und in der Regel mehrmals verwendet wird.
Klassen können in CSS mehrfach angewendet werden, IDs dagegen können aufgrund der Eigenschaft immer eindeutig identifizierbar zu sein, nur einmal pro Seite verwendet werden können. Klassen und IDs dürfen in CSS nicht miteinander kombiniert werden.

Globale Klassen definieren

Beispiel - Definition in css

.hinweis {
font-style:italic;
}

Beispiel in Kombination mit dem <p> Tag:

<p class="hinweis">Hier erscheint der Text.</p>

Tag-spezifische Klassen definieren

Klassen nur fÜr bestimtme Tags definieren

Beispiel - Definition in css

p.hinweis {
font-style:italic;
}

Gilt nur in Verbindung mit der Klasse ”hinweis” und dem Tag <p>:

<p class="hinweis">Hier erscheint der Text.</p>

Hier wÜrde die ”hinweis“ Definition nicht greifen:

<h1 class="hinweis">Hier erscheint der Text.</h1>

Pseudo-Klassen und Pseudo-Elemente definieren

Pseudo-Klassen werden in css definiert aber nicht explizit in dem HTML Dokument verwendet. Beispiel hierfÜr sind die Definition von noch nicht besuchten und bereits von dem Nutzer besuchten Links.

Beispiel - Definition in css

a:link {
color:lime;
}

a:visited {
color:yellow;
}

Hinweis:
Pseudo-Klassen:
:link – Definition von noch nicht besuchten Links
:visited – Definition von besuchten Links

Pseudo-Elemente
:first-line – Definition der ersten Zeile (eines Paragraphen) :first-letter – Definition des ersten Buchstaben (eines Paragraphen)