Pseudoklassen

Gestaltung von Links: visited, hover usw.

Wir können Links unterschiedlich darstellen, je nachdem ob sie bereits besucht wurden (visited), ob gerade die Maus darüber fährt (hover) usw.
Definition in der CSS-Datei:
a:link { background-color: #00FF00; }
a:visited { background-color: silver; }
a:focus { background-color: orange; }
a:hover { background-color: yellow; }
a:active { background-color: red; }

Achtung: Die Reihenfolge der CSS-Definitionen spielt eine Rolle: hover gewinnt hier über focus, weil im CSS-File später definiert.

Bei link kann definiert werden, wie ein Link allgemein aussieht.
Mit visited können bereits besuchte Links gestaltet werden.
Und mit hover werden Links gestaltet, über denen die Maus gerade schwebt (to hover).

Die Pseudoklassen funktionieren nicht nur für Links

Z.B. bei dem Menü auf dieser Seite, wird dafür gesorgt, dass die Hintergrundfarbe dunkler wird, wenn du über einen Menü-Eintrag fährst. Dies ist eine Eigenschaft, die ich dem Listeneintrag (mein Menü ist eine unordered list) <li> zugeordnet habe.

Hier gibt's ein tolles Video-Tutorial zum Thema :hover.