Deprecated: Methods with the same name as their class will not be constructors in a future version of PHP; breadcrumb has a deprecated constructor in /kunden/dciwam.de/webseiten/dciwam/includes/class.breadcrumb.inc.php on line 23
Richtige Reihenfolge der link
-Pseudo-Klassen
Meine Links werden nicht so dargestellt, wie ich das in den Cascading Style Sheets angegeben habe. Was tun?
Falls du Pseudo-Klassen verwendest, liegt das Problem möglicherweise in der Reihenfolge der Regeln für die Links. Ändere sie in:
a:link { color: red } /* link pseudo-class, noch nicht besuchter Link */ a:visited { color: blue } /* link pseudo-class, schon besuchter Link */ a:hover { color: yellow } /* dynamic pseudo-class, Benutzer 'hovert' */ a:active { color: lime } /* dynamic pseudo-class, Link wird ausgewählt */ a:focus { color: lime } /* dynamic pseudo-class, Element akzeptiert Eingaben */
Jeder Link ist entweder noch nicht besucht worden oder er wurde bereits besucht. Falls
er noch nicht besucht wurde, gilt die a:link
-Pseudo-Klasse. Falls er bereits
besucht wurde, dann gilt die a:visited
-Pseudo-Klasse. Er kann zusätzlich
zum "Zustand" visited (bzw. not-visited) noch den "Zustand" a:hover
(für "darüber
schwebend") und a:focus
(ist ausgewählt / hat den Fokus) annehmen.
Definierst du a:hover
vor a:visited
, dann überschreibt die
Definition für a:visited
die Definition für a:hover
.
Definierst du dagegen a:hover
nach a:visited
,
dann überschreibt die Definition für a:hover
die
Definition für a:visited
.
Damit sollte auch klar sein, warum a:active
nach a:hover
stehen
sollte. a:active
definiert die Eigenschaften, die ein aktiver Link (ein Link,
auf den du gerade "draufdrückst") hat. Er besitzt die Eigenschaften not-visited oder
visited und hover und active.
Ein besuchter Link oder ein Link über den man gerade mit der Maus fährt etc. ist eben auch ein Link, deshalb gehen die Regeln mit den Selektoren in die Kaskade ein.
Der Unterschied zwischen a:active
und a:focus
ist am besten
zu verstehen, wenn man einen Link per Tastatur anspringt, statt mit der Maus drauf zu klicken.
Mit Tastatur gibt es den Unterschied zwischen tab=ausgewählt (hat den Fokus)
und return=aktiviert
.
Mit der Maus gibt es nur klick=aktiviert
.
Siehe dazu:
http://www.w3.org/TR/REC-CSS2/selector.html#dynamic-pseudo-classes
Hinweis
Bei der Definition einer Textfarbe (color
) sollte möglichst auch immer
eine Hintergrundfarbe angeben werden (background-color
bzw. background
).
Oft wird background-color: transparent
verwendet, wenn keine Hintergrundfarbe
erwünscht ist. Jedoch macht transparent
bei Netscape 4.xx die bekannten
abenteuerlichen Fehler:
Ältere Browser unterstützen die Pseudo-Klassen nicht vollständig. Von daher
ist es eventuell besser auf background-color: transparent
zu verzichten und
eine Validator-Warnung in Kauf zu nehmen. Es sei denn transparent
wird
in Verbindung mit background-image
benötigt.
Siehe dazu:
http://css.nu/pointers/bugs.html oder
auch
http://www.webreview.com/style/css1/charts/notes.shtml#532transparent
Rene v. Bulmerincq · http://www.inforunner.de
Huschiar Madjidi · http://www.netandmore.de
Gérard Schneider