Webdesign mit (X)HTML und CSS

Ein Kurs für Einsteiger

Sie sind hier

Startseite › CSS › Arten von Selektoren › Pseudoklassen › Reihenfolge
aktualisiert:
05.10.2008
erstellt:
14.06.2007

Reihenfolge

Am häufigsten kommen Pseudoklassen bei Links zum Einsatz. Dabei ist auf eine sinnvolle Reihenfolge der Angaben zu achten; meist liefert folgende Reihenfolge das gewünschte Ergebnis:

  1. a:link {…}
  2. a:visited {…}
  3. a:hover {…}
  4. a:focus {…}
  5. a:active {…}

Angaben, die für den Typselektor a gemacht werden, gelten für alle Zustände eines Links. Wenn z.B. für eine Navigation alle Links eine bestimmte Farbe erhalten sollen, die sich beim Überfahren mit der Maus ändert, so genügt es, zunächst eine allgemeine Angabe #navigation a {color:red;} für alle Zustände zu machen und dann eine Ergänzung für #navigation a:hover {color:blue;}.

Grundsätzlich sollte man darauf achten, dass Links auch beim »Durchtabben« mit der Tastatur (:focus!) deutlich hervorgehoben werden. Die Standardkennzeichnung der Browser ist ein leichter Punktrahmen um das fokussierte Element.