Question

我在引导程序方面有点新意，我被教导alpha-4 btw，在我的网站上制作navbar时，我发现它崩溃并显示3行线时出现问题 - 菜单的图标，它与.navbar-brand重叠徽标。我只是通过添加pull-right来解决这个问题。

现在看起来这样，它确实有用......

<nav class="navbar navbar-dark bg-inverse navbar-fixed-top" id="navbar">

                <button class="navbar-toggler hidden-lg-up pull-right" type="button" data-toggle="collapse" data-target="#navbarContent"> &#9776;

                </button>

            <a class="navbar-brand"  href="#">YO-Maps</a>


            <div class="collapse navbar-toggleable-md" id="navbarContent">


                  <ul class="nav navbar-nav">
                    <li class="nav-item">
                      <a class="nav-link" href="#jumbotron">Home <span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#about">About</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="#footer">Download</a>
                    </li>
                  </ul>
                  <form class="form-inline pull-sm-right">
                    <input class="form-control" type="email" placeholder="Email">
                    <input class="form-control" type="password" placeholder="Password">
                    <button class="btn btn-success" type="submit">Login</button>
                  </form>
             </div>
        </nav>

在检查bootstrap 3（v 3.3.2）时，我发现in other examples这甚至不需要，因为我认为.navbar-header存在......

所以我的问题是：这个类在实现Bootstrap 4时是否很重要？ official docs没有提到它，我实际上在我的代码中尝试它并没有任何区别...和它真的让“东西”成为Bootstrap 3中的一个标签吗？

Answer 1

Nope，navbar-header并不包含在Bootstrap 4中的任何位置.navbar-brand和navbar-toggler不再需要包装在他们自己的div中。

Bootstrap 4 - Navbar Header用法

1 个答案: