CSS - Pseudo-classe: hover

La description

La pseudo-classe : hover est utilisée pour ajouter un effet spécial à un élément lorsque vous passez la souris dessus.

Lors de la définition de pseudo-classes dans un bloc <style> ... </style>, les points suivants doivent être pris en compte -

  • a: hover DOIT venir après a: link et a: viewed dans la définition CSS pour être efficace.

  • a: active DOIT venir après un: hover dans la définition CSS pour être efficace.

  • Les noms de pseudo-classes ne sont pas sensibles à la casse.

  • Les pseudo-classes sont différentes des classes CSS mais elles peuvent être combinées.

Valeurs possibles

  • color - Toute valeur de couleur valide.

S'applique à

Élément Anchor / Link.

Exemple

Voici l'exemple qui montre comment use : hover class pour changer la couleur des liens lorsque nous plaçons un pointeur de souris sur ce lien.

<html>
   <head>
      <style type = "text/css">
         a:hover {color: #FFCC00}
      </style>
   </head>

   <body>
      <a href = "/html/index.htm">Bring Mouse Here</a>
   </body>
</html>

Cela produira le lien suivant. Maintenant, vous amenez votre souris sur ce lien et vous verrez qu'il change sa couleur en jaune.