Maison >interface Web >tutoriel CSS >Comment puis-je activer une liste déroulante Bootstrap en survol au lieu d'un clic ?

Comment puis-je activer une liste déroulante Bootstrap en survol au lieu d'un clic ?

Barbara Streisand
Barbara Streisandoriginal
2024-11-11 06:02:03921parcourir

How can I make a Bootstrap Dropdown Activate on Hover Instead of Click?

Déroulante Bootstrap activée par le survol

Question :

Comment puis-je modifier une liste déroulante Bootstrap menu à déclencher au survol au lieu de cliquez ?

Réponse :

Bien que Bootstrap n'autorise pas nativement l'activation au survol, vous pouvez réaliser cette personnalisation avec CSS. Voici comment :

.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* remove the gap to prevent closing */
}

Ce code remplace la propriété d'affichage par défaut du menu déroulant lorsque l'élément parent (.dropdown) est survolé, le rendant visible. La propriété margin-top élimine l'espace qui apparaît généralement entre le menu déroulant et son conteneur.

En modifiant le CSS comme décrit, vos menus déroulants s'ouvriront désormais lorsque vous survolerez leurs éléments parents, offrant ainsi une plus grande visibilité à l'utilisateur. -expérience de navigation conviviale et intuitive.

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