Maison >interface Web >tutoriel CSS >Comment transitionner en douceur les couleurs d'arrière-plan lors du survol du menu ?
Comment implémenter des transitions fluides de couleur d'arrière-plan pour les survols de menu
Obtenir un effet de transition pour la couleur d'arrière-plan en survol est une exigence de style courante, mais peut parfois présenter des défis. Ici, nous explorons une solution à ce problème.
Code original
Le code CSS fourni tente d'implémenter des transitions de couleurs d'arrière-plan, mais rencontre un problème :
#content #nav a:hover { color: black; background-color: #AD310B; /* Transition properties */ }
Solution
Pour activer les transitions, vous devez garantir la prise en charge sur les différents navigateurs. Le code mis à jour suivant devrait fournir l'effet de fondu souhaité :
a { background-color: #FF0; } a:hover { background-color: #AD310B; -webkit-transition: background-color 1000ms linear; -ms-transition: background-color 1000ms linear; transition: background-color 1000ms linear; }
Explication
Exemple
<a>Navigation Link</a>
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!