CSS-Links

CSS Tutorial > Links

Der vorgegebene Stil für einen Link ist eine unterstrichene blaue Schrift. Dies ist aber nicht immer ideal. Es kann sein, dass wir Links mit einem anderen Stil möchten. Dies kann mit Hilfe der folgenden Selektoren erreicht werden:

a:link: Gibt an, wie der Link aussieht, wenn die Seite noch nicht besucht wurde.

a:visited: Gibt an, wie der Link aussieht, wenn die Seite bereits besucht wurde.

a:hover: Gibt an, wie der Link aussieht, wenn der Mauszeiger sich über dem Link befindet.

a:active: Gibt an, wie der Link aussieht, wenn der Link geklickt wird.

Schauen wir uns die folgenden Statements an:

a:link {color:#FF0000; text-decoration:none;}
a:visited {color:#0000FF; text-decoration:none;}
a:hover {font-size:20; color:#00FF00; text-decoration:underline;}
a:active {color:#FF00FF; text-decoration:underline;}

Dies bedeutet Folgendes:
1) Wenn die Seite das erste Mal geladen wird, ist die Schriftfarbe rot.
2) Sobald der Link besucht wurde, wird die Schriftfarbe blau.
3) Wenn Sie die Maus über den Link bewegen, so wird die Schriftgröße 20, die Schriftfarbe wird grün und der Link wird unterstrichen.
4) Wenn Sie auf den Link klicken, wird die Schriftfarbe Rosa und der Link bleibt weiterhin unterstrichen.

Bewegen Sie Ihre Maus über den „Beispielslink” um diese Effekte zu sehen.

Beispielslink

Folgende Seite: CSS List