Hover effekt

[Jaba]

Hallo,auf meiner Seite möchte ich für unterschiedliche Links auch unterschiedliche Styles zeigen. Die mehrheit der Links soll so aussehen:

a:link    { color: #FF0000; text-decoration: none}
a:visited { color: #FF0000; text-decoration: none}
a:hover   { color: #FF0000; text-decoration: none}

Hier und da soll ein Link einen anderen Hover-Effekt bekommen:

a.beispiel:link { color: #191970; text-decoration: underline; }
a.beispiel:hover { color: #191970; text-decoration: none; }
a.beispiel:visited { color: #191970;  text-decoration: none; }

ich konnte zwar beim IE keine Komplikationen feststellen, aber ist es nicht eine Doppelbelegung eines Links, könnte es dabei Probleme geben?

[telofon]

Hallo

ich konnte zwar beim IE keine Komplikationen feststellen, aber ist es nicht eine Doppelbelegung eines Links, könnte es dabei Probleme geben?

Das kommt auf die Reihenfolge an, in der du diese Zeilen in deinem CSS schreibst. Du musst die globalen Links (a:link etc) weiter oben im CSS haben als die Ausnahme (a.beispiel:link etc). Dann wird dein Beispiels-Link auch nicht mit dem globalen Link überschrieben.

Gruß
telofon

[Gunnar Bittersmann]

@@telofon:

nuqneH

Das kommt auf die Reihenfolge an, in der du diese Zeilen in deinem CSS schreibst. Du musst die globalen Links (a:link etc) weiter oben im CSS haben als die Ausnahme (a.beispiel:link etc).

Nein.

Dann wird dein Beispiels-Link auch nicht mit dem globalen Link überschrieben.

Wird es auch sonst nicht, da der Selektor 'a.beispiel:link' eine hörere http://de.selfhtml.org/css/formate/kaskade.htm#spezifitaet@title=Spezifität hat als der Selektor 'a:link'.

Auf die Reihenfolge kommt es bei Selektoren gleicher Spezifität an, bspw. bei 'a:link', 'a:visited' und 'a:hover'.

Qapla'

[Længlich]

Jéndi!

a:link    { color: #FF0000; text-decoration: none}
a:visited { color: #FF0000; text-decoration: none}
a:hover   { color: #FF0000; text-decoration: none}

Hier und da soll ein Link einen anderen Hover-Effekt bekommen:

a.beispiel:link { color: #191970; text-decoration: underline; }
a.beispiel:hover { color: #191970; text-decoration: none; }
a.beispiel:visited { color: #191970;  text-decoration: none; }

ich konnte zwar beim IE keine Komplikationen feststellen, aber ist es nicht eine Doppelbelegung eines Links, könnte es dabei Probleme geben?

Keine Sorge, das ist unproblematisch. Die letztgenannten Eigenschaften überschreiben einfach die vorherigen; eine Doppelung entsteht nicht. (Das Stichwort zu der Frage, welche Selektoren stärker sind als andere, lautet Spezifizität; und wenn diese gleich ist, überschreiben die zuletzt notierten die vorigen.)

Genau genommen nutzt Du dieses Prinzip des Überschreibens schon bei den ersten Eigenschaften, denn da überschreibst Du das Default-Blau aus dem Browserstylesheet.

Viele Grüße vom Længlich