Rollover auf Links

Noch schöner, noch besser mit :hover

  Rollover-Effekte sind nicht nur cool zum Programmieren, sie verbessern auch die Benutzerfreundlichkeit (en. usability): Die Besucher deiner Website merken schneller, welche Textstellen Links sind.

Fährt der User mit dem Cursor über den Link, kannst als Entwickler*in mit CSS bestimmen, was passieren soll (funktioniert nicht auf Touch-Screens!).

a:hover {
	/* z.B. Textfarbe ändern */
	color: #FF0000;
}

Vorschau (formatiert)

Was heisst :hover?

Den ":hover"-Zustand könnte man etwa so auf deutsch übersetzen: Die Maus schwebt über dem Link.

🤔 CSS-Wörter, die mit einem Doppelpunkt beginnen, heissen "Pseudoklassen". Aber lass dir bitte nicht den Spass verderben durch diesen unschönen Begriff! Du kannst das Ding hier auch einfach kopieren und in deinen Code einsetzen, ohne das auswendig lernen zu müssen.