Désactiver le changement de couleur de la balise d'ancrage lors de la visite

Question

Je dois désactiver le changement de couleur de la balise d'ancrage lors de la visite. J'ai fait ça:

 a:visited{ color: gray }
 

(Le lien est de couleur grise avant la visite). Mais c’est une façon pour laquelle j’indique explicitement la couleur après la visite du lien, ce qui est encore un changement de couleur.

Comment puis-je désactiver le changement de couleur de la balise d'ancrage lors de la visite sans effectuer de changement de couleur explicite?

Answer 1

Si vous voulez juste le point d'ancrage de la couleur à rester le même que le point d'ancrage de l'élément parent, vous pouvez tirer parti de hériter:

a, a:visited, a:hover, a:active {
  color: inherit;
}

Notez qu'il n'est pas nécessaire de répéter la règle pour chaque sélecteur; il suffit d'utiliser une liste séparée par des virgules de sélecteurs (importance de l'ordre pour l'ancrage des éléments pseudo). Aussi, vous pouvez appliquer la pseudo-sélecteurs de classe si vous souhaitez désactiver de manière sélective les ancres spéciales couleurs:

.special-link, .special-link:visited, .special-link:hover, .special-link:active {
  color: inherit;
}

Votre question ne demande qu'à propos de la visité de l'état, mais je suppose que vous vouliez dire tous les états. Vous pouvez supprimer les autres sélecteurs si vous souhaitez autoriser les changements de couleur sur l'ensemble mais ont visité.

Answer 2

Vous ne pouvez pas, vous pouvez seulement styliser l'état visité.

Pour que d'autres personnes trouvent cela, assurez-vous de les avoir dans le bon ordre:

 a {color:#FF0000;}      /* unvisited link */
a:visited {color:#00FF00;}  /* visited link */
a:hover {color:#FF00FF;}  /* mouse over link */
a:active {color:#0000FF;}  /* selected link */
 

Answer 3

Selon w3schools.com :

a: hover DOIT venir après un: lien et un: visité dans la définition CSS pour être efficace!

Donc, si vous voulez désactiver le changement de couleur, un: visité doit venir après un: survol. Comme ça:

 a { color: gray; }
a:hover { color: red; }
a:visited { color: gray; }
 

Answer 4

Supprimez le sélecteur ou réglez-le sur la même couleur que votre texte apparaît normalement.