Pseudo-classe :link CSS

Définition et utilisation

CSS :link Les pseudo-classes sont utilisées pour sélectionner et définir les styles des liens non visités.

Attention ::link Les pseudo-classes ne définissent pas le style des liens visités.

Astuce :Utiliser :visited Définir le style des liens des pages visitées, en utilisant :hover Définir le style des liens au survol de la souris, en utilisant :active Définir le style des liens lors du clic.

Attention :Dans la définition CSS,:link Doit être placé :hoveravant de prendre effet !

Exemple

Exemple 1

Sélectionner et définir les styles des liens non visités :

a:link {
  background-color: yellow;
}

Essayez-le vous-même

Exemple 2

Sélectionner et définir les styles des liens non visités, visités, au survol et actifs :

/* Lien non visité */
a:link {
  color: green;
}
/* Lien visité */
a:visited {
  color: green;
}
/* Lien au survol de la souris */
a:hover {
  color: red;
}
/* Lien actif */
a:active {
  color: yellow;
}

Essayez-le vous-même

Exemple 3

Définir des styles différents pour les liens :

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

Essayez-le vous-même

Grammaire CSS

:link {
  déclarations css;
}

Détails techniques

Version : CSS1

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge cette pseudo-classe.

Chrome Edge Firefox Safari Opera
4.0 7.0 2.0 3.1 9.6

Pages associées

Tutoriel :Lien CSS

Tutoriel :Pseudo-classes CSS