Comment changer la couleur d'un lien en HTML et CSS ?

Réponses rédigées par Antoine

Dernière mise à jour : 2019-11-22 16:12:38

Question

Comment faire pour changer la couleur d'un lien en HTML et CSS ?

Réponse

Vous pouvez changer la couleur d'un lien en HTML et CSS, selon quatre scénarios, et ainsi appliquer quatre couleurs différentes :

La couleur standard.
La couleur visitée.
La couleur de survol.
La couleur active.

Pour changer la couleur d'un lien hypertexte, il faut utiliser les feuilles de styles CSS ; voici un exemple simple pour changer la couleur d'un lien en HTML et CSS :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>

<style>
a:link {
color: gray;
}

a:visited {
color: green;
}

a:hover {
color: purple;
}

a:active {
color: blue;
}
</style>

<a href="#">un exemple pour changer la couleur d'un lien hypertexte</a>

</body>
</html>

Vous trouverez plus d'informations sur l'utilisation des pseudo-classes active, visited, link et hover sur cette page du site de Mozilla.

Réponse

Tout en reprenant l'exemple de Antoine, et si vous voulez changer la couleur d'un lien HTML en particulier, il vous suffit d'attribuer une CLASS à la balise <a> concernée, et de modifier quelque peu le code CSS :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>

<style>
a.specifique:link {
color: gray;
}

a.specifique:visited {
color: green;
}

a.specifique:hover {
color: purple;
}

a.specifique:active {
color: blue;
}
</style>

<a href="#" class="specifique">un exemple pour changer la couleur d'un lien hypertexte en particulier</a>

</body>
</html>