Dynamic-Mess.com


"The world is a dynamic mess of jiggling things..."

Changer la couleur des liens en CSS

Article posté le 22-07-2014 dans la catégorie HTML et CSS

Par défaut dans tout votre site, vous pouvez régler la couleur et le comportement de vos liens. Exemple :

a
{
    color: blue;
    font-weight:bold;
    text-decoration:none;
}
a:link
{
    color: blue;
    font-weight:normal;
}
a:visited
{
    color: blue;
    font-weight:normal;
}

Mais il se peut que vous désiriez des spécificités en fonction de certaines zones des pages... Soit une div de classe "contenu". Voici comment modifier les attributs des liens de cette div :

.contenu a:link {color:orange; text-decoration : none;}
.contenu a:visited {color:orange;}
.contenu a:active {color:orange;}
.contenu a:hover {color:orange; font-weight: bold;}

Note : si "contenu" avait été l'id de la div et non sa classe, on aurait eu :

#contenu a:link {color:orange; text-decoration : none;} ...

Maintenant, imagionons que vous souhaitiez créer une classe spéciale pour certains liens. Par exemple

<a class="MENUTOP">...</a>

Vous pouvez définir cette classe comme ceci :

.menuTOP:link {color:white; text-decoration : none;}
.menuTOP:visited {color:white;}
.menuTOP:a:active {color:white;}
.menuTOP:hover {color:white; background-color: black; font-weight: bold;}

Cet article vous a plu? Découvrez d'autres articles


Tweet
comments powered by Disqus