: survoler - Astuces CSS

Anonim

La :hoverpseudo-classe en CSS sélectionne les éléments lorsque le curseur de la souris les survole. Il est généralement associé aux éléments link ( ).

a:hover ( color: green; text-decoration: underline overline; )

Ainsi, lorsqu'un lien comme celui-ci est «survolé» (comme avec un curseur sur un appareil avec une souris):

Go to Google

Il deviendra vert et aura une ligne en dessous et au-dessus.

Dans IE 6 et ci-dessous, :hover utilisé pour fonctionner uniquement sur les liens, mais dans les navigateurs plus récents, il fonctionne sur n'importe quel élément. Cela peut être particulièrement utile pour des éléments tels que les menus déroulants dans lesquels vous pouvez attendre l' :hover élément de la liste parent puis révéler le niveau suivant du menu imbriqué. Attention cependant, les effets de survol doivent être associés à une sorte d'action, car c'est un modèle Web établi de longue date.

En rapport

  • :lien
  • :a visité
  • :concentrer
  • :actif
  • Amour-haine

Plus de ressources

  • MDN Docs sur: survoler
  • La spécification W3C sur: survoler

Prise en charge du navigateur

La :hoverpseudo classe est prise en charge par tous les navigateurs.