attributs des liens visités

18 déc. 2007, 09:59

Bonjour,

j'ai un petit problème au niveau des css de liens.

j'ai 2 types de liens dans mon css, pour simplifer ca ressemble à ça :

Code : Tout sélectionner

A.lien1 {color:black;}:visited{color:black;}
A.lien2 {color:blue;}:visited{color:blue;}

Le problème est que les liens ayant pour classe lien1 ou lien2 ont la bonne couleur lorsqu'ils n'ont pas été visité mais une fois visité, ils ont la couleur de lien 2 visité.
C'est à dire que tous les liens déclarés, une fois visités, ont les attributs du dernier visited.

Comment remédier à ça?

18 déc. 2007, 13:09

Corrige ta CSS comme suit :

Code : Tout sélectionner

a.lien1 {
  color: black;
}
a.lien2 {
  color: blue;
}

Étant donné que tu veux, apparemment, attribuer la même couleur au lien, qu'il ait été visité ou non, il n'est pas nécessaire de mentionner la pseudo-classe :visited.

De plus, n'oublie pas qu'une règle CSS en bas d'une feuille de style écrase une règle similaire située plus haut.

Code : Tout sélectionner

a {
  color: black;
}
/* À ce stade, tous les liens seront affichés en noir, quel que soit leut état (visité, au survol, actif ou rien du tout) */
a {
  color: blue;
}
/* En fait, tous les liens seront affichés en bleu, puisque j'écrase une règle similaire. */
a:visited {
  color: red;
}
/* En fait, tous les liens visités ne seront pas affichés en bleu, mais en rouge. */

C'est ce qui t'est arrivé, en codant deux fois la règle :visited (sans préciser quel élément ou classe concerné), mais avec des propriétés différentes, la seconde règle l'emportant sur la première.

18 déc. 2007, 14:44

oki je pensais qu'en fait l'attribut :visited s'appliquait à la classe définie en début de ligne.

J'ai donc corrigé de cette manière et maintenant tout est en ordre.

Code : Tout sélectionner

//commun à tous les liens
A{cursor:hand;text-decoration:none;}

//différents types de liens
lien1{color:black;}
lien1:visited{color:black;}
lien2{color:blue;}
lien2:visited{color:blue;}

Merci des réponses

18 déc. 2007, 16:26

J'ai donc corrigé de cette manière et maintenant tout est en ordre.
Code : Tout sélectionner
//commun à tous les liens A{cursor:hand;text-decoration:none;} //différents types de liens lien1{color:black;} lien1:visited{color:black;} lien2{color:blue;} lien2:visited{color:blue;}

Quelques remarques sur ce code :

la propriété cursor: hand est superflue pour un élément a, vu que les navigateurs font afficher le curseur de la souris sous forme de main lorsque ce dernier survole ledit élément (à moins que certains navigateurs ne le fassent pas par défaut... ) ;
pourquoi définir les règles lien1:visited et lien2:visited si c'est pour reprendre la même couleur que lien1 et lien2 respectivement ? Dans ce cas, lien1 et lien2 suffisent.

attributs des liens visités

Qui est en ligne