首页 > web前端 > css教程 > 如何使 Bootstrap 下拉菜单启用悬停?

如何使 Bootstrap 下拉菜单启用悬停?

DDD
发布: 2024-11-12 06:18:02
原创
573 人浏览过

How to Make Bootstrap Dropdowns Hover-Enabled?

Bootstrap Hover Dropdown

您已使用 Bootstrap 的“onClick”功能配置了带有下拉菜单的导航栏。但是,您希望在鼠标悬停时激活下拉菜单。

解决方案:

Bootstrap 不提供内置的下拉菜单悬停功能。为此,我们可以利用 CSS:

.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* remove the gap so it doesn't close */
}
登录后复制

此 CSS 规则将:

  • 当父下拉列表悬停时显示下拉菜单
  • 消除由默认 margin-top 值创建的间隙

以上是如何使 Bootstrap 下拉菜单启用悬停?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板