html - 下拉菜单处于活动状态,而不是项目
问题描述
当我单击其中的一个项目时,我希望我的下拉菜单处于活动状态,换句话说,服务一词处于活动状态。我怎样才能做到这一点?
<nav class="navbar navbar-light navbar-expand-xl">
<a class="navbar-brand" href="#"><img src="" alt=""/></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="#"> Home</a>
</li>
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="#"
id="navbarDropdown"
role="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Services
</a>
<div class="dropdown-menu active" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#" id="active"
>Lala</a>
<a class="dropdown-item" href="#"
>Haha</a
>
</div>
</li>
</ul>
</div>
</nav>
解决方案
试着在你的 li 上上积极的课
<!--- <li class="nav-item dropdown active">--->
<li class="nav-item dropdown active">
<a
class="nav-link dropdown-toggle"
href="#"
id="navbarDropdown"
role="button"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Services
</a>
<div class="dropdown-menu active" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#" id="active"
>Lala</a>
<a class="dropdown-item" href="#"
>Haha</a
>
</div>
</li>
推荐阅读
- flutter - 在颤动中以条纹方式付款时出错
- mysql - 有没有办法在mysql更新忽略查询期间找到被忽略的行?
- laravel - Laravel Sanctum Vue.js - 如何检查会话是否过期
- android - 在图像加载之前显示进度条。扑
- postgresql - Docker Compose Postgres 总是以超时或连接被拒绝而结束
- symfony - Symfony 2.8:如何格式化日期时间表单类型?
- go - 如何创建需要使用数据库的测试代码
- windows - 如何在 Spring Boot 中获取 Windows AD 令牌?
- spring-boot - 包含依赖项后,JSP 文件未在 Spring-Boot 中呈现
- html - 如何使用:使用 css 检查响应式导航栏