Textlinks bei Mausover unterstrichen - Wie ?

Hi!

Ich möchte folgendes erreichen:

Habe einen einfachen textlink (kein Image!!!). wenn ich mit der maus darüber fahre, dann soll dieser unterstrichen sein.

Wie geht das? CSS oder Javascript oder nur ne body-anweisung?
Im Self-HTML finde ich nicht die Lösung!

T.I.A.

Gr. Andre!

Hallo Andre,

mit CSS geht das:

a
{text-decoration: none;
color: #273F49;}
a:active
{text-decoration: none;
color: #273f49}
a:hover
{text-decoration: underline;
color: #ff9900}

Die Farben kannst du nach eigenem Geschmack anpassen…

Gruß
Uschi

Textlinks unterstreichen - Ergänzung
tach auch.

Ich möchte den Artikel von Uschi noch etwas ergänzen:

zum ersten : Netscape 4.x unterstützt a:hover und a:active nicht und somit habe diese StyleSheetangabe auch keine Wirkung. Im IE5 funktioniert es ohne größere Probleme. (zu NS6 siehe 3.)

zum zweiten : Anscheinend ist die Reihenfolge in der die StyleSheet-Angaben zu gemacht werden nicht ganz uninteressant. Auch wenn es in SelfHTML nicht drin steht (oder ich habe es überlesen). Mit der folgenden Reihenfolge habe ich aber in allen Browsern die ich gestestet habe keine Probleme gehabt:

a{text-decoration:none;}
a:active{color:#666666;}
a:visited{color:#333333;}
a:hover{text-decoration:underline;}
a:link{color:#000000;}

zum dritten : Beim NS6 hatte ich Probleme bei dem „Unterstreichen“, wenn ich den Link innerhalb einer Tabelle hatte. Das Problem trat aber nur dann auf, wenn ich vor der Angabe zu der Tabelle selber noch keine StyleSheets zugewiesen habe. Sobald diese Angabe da war klappte alles wie gewünscht:

/\* fuer NS6 \*/
td{color:#000000;}

a{text-decoration:none;}
a:active{color:#666666;}
a:visited{color:#333333;}
a:hover{text-decoration:underline;}
a:link{color:#000000;}

Gruss Jens

1 Like