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

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!