我正在使用 Bootstrap 4 创建我的响应式网站,并且我正在使用基于此 Bootstrap documentation 的响应式导航栏组件。导航栏在桌面上运行良好,但在移动设备上它坏了,我不知道为什么。
我的代码:
<nav class="navbar navbar-expand-lg nl-navbar navbar-light">
<a class="navbar-brand" href="#">
<img src="#" alt="Logo" class="col-lg-7 col-md-6
col-sm-5 col-5"/>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarTogglerDemo02">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav ml-auto nl-navbar-ul">
<li class="nav-item active">
<a class="nav-link mr-3" href="#">Link 1</a>
</li>
<li class="nav-item active">
<a class="nav-link mr-4" href="#">Link 2</a>
</li>
<li class="nav-item active">
<a class="nav-link mr-4" href="#">Link 3</a>
</li>
<button class="btn my-2 my-sm-0 nl-btn-nav-secondary" type="button" data-
toggle="modal" data-target="#"
id="#">Btn Here</button>
</ul>
</div>
</nav>