Maison >interface Web >tutoriel CSS >Pourquoi mon code de survol CSS ne souligne-t-il pas mon lien ?

Pourquoi mon code de survol CSS ne souligne-t-il pas mon lien ?

Susan Sarandon
Susan Sarandonoriginal
2025-01-04 12:40:43693parcourir

Why Doesn't My CSS Hover Code Underline My Link?

Comprendre le « survol » en CSS

Lorsque vous travaillez avec CSS, le « survol » est un concept crucial pour modifier les styles d'éléments lors de l'interaction de la souris. Cependant, pour obtenir le résultat souhaité, il faut une mise en œuvre correcte.

L'énigme du « survol »

Récemment, une question s'est posée concernant l'incapacité du code suivant à souligner un lien lors du survol :

<a class="hover">click</a>

a .hover:hover {
    text-decoration: underline;
}

Dévoilement de la solution

Pour remédier au problème, nous devons nous rappeler que le « survol » est un pseudo-élément. La syntaxe correcte est :

a:hover {
    text-decoration: underline;
}

Alternativement, si un nom de classe est préféré :

a.hover:hover {
    text-decoration: underline;
}

Le nom de classe 'survolé'

Lors de l'utilisation d'une classe -name comme 'hover' peut sembler redondant, il peut être appliqué dans des situations où vous souhaitez basculer plusieurs propriétés lors du survol en utilisant une règle CSS distincte pour '.survoler'. Cependant, si le seul but est de souligner un lien au survol, le sélecteur a:hover reste le choix préféré.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn