: lien - Astuces CSS | CSS Almanach 2025

Le :linksélecteur est une pseudo-classe qui cible tous les éléments anchor ( ) non visités sur une page.

a:link ( color: aquamarine; )

L'exemple ci-dessus changera la couleur de tous les liens non visités en aigue-marine.

Lorsqu'il est utilisé en combinaison avec la :hoverpseudo-classe, :linkdoit apparaître en premier, ou ne pas être défini du tout, pour que les :hoverstyles fonctionnent. En effet, ils sont tout aussi spécifiques, donc s'ils :linkvenaient après, ces styles remplaceraient les styles de survol.

La :linkpseudo-classe ciblera tous les éléments qui ont un hrefattribut, même si le hrefa une valeur vide. Donc, dans ce sens, c'est comme le sélecteur d'attribut (href).

Cela signifie que les trois éléments HTML suivants peuvent tous être stylisés via la :linkpseudo-classe:

CSS-Tricks CSS-Tricks CSS-Tricks

Cependant, le troisième exemple du bloc de code ci-dessus serait du HTML non valide.

Il n'y a que trois éléments HTML qui acceptent l' hrefattribut: , et . Seul l' élément peut être stylisé via la :linkpseudo-classe.

De plus, vous ne pouvez pas ajouter l' hrefattribut à un autre type d'élément et le rendre stylable via :link. En d'autres termes, si vous aviez le code HTML suivant:

 CSS-Tricks

Le CSS suivant n'aurait aucun effet:

div:link ( color: aquamarine; )

Encore une fois, le HTML échouerait à la validation, car ce hrefn'est pas un attribut valide pour .

En raison du fait qu'il :linkne peut cibler que des éléments, les :linkstyles peuvent être définis dans le CSS sans le sélecteur de type d'élément, comme ceci:

:link ( color: aquamarine; )

De plus, à toutes fins pratiques lors de l'utilisation de HTML, la :linkpseudo-classe est quelque peu hors de propos puisque le même effet peut être obtenu en ciblant simplement tous les éléments directement:

a ( color: aquamarine; )

Cependant, s'il y a des éléments sur la page qui n'ont pas l' hrefattribut défini (par exemple, sur les pages héritées qui étaient utilisées ), le code ci-dessus ciblerait également ces éléments, et cela peut ne pas être le résultat souhaité.

Il faut également souligner qu'à partir de CSS2, d'autres langages de document (en plus du HTML) peuvent définir d'autres éléments, en plus des ancres, qui peuvent être stylisés via la :linkpseudo-classe.