Bootstrap 4：无论屏幕大小始终显示移动菜单按钮

Question

无论屏幕尺寸如何，我怎样才能始终显示移动菜单按钮？在有人单击移动按钮之前，我不希望链接出现。谢谢！

我知道 Bootstrap 3 上有一个 post，但它不适用于 Bootstrap 4。请指教好吗？

Answer 1

更新Bootstrap4.1.x

排除 navbar-expand* class。

从测试版开始，navbar-toggleable-* class 被 navbar-expand-* 取代，但现在一切都上升了一层。由于导航栏的默认状态始终是 collapsed/mobile (xs)，因此您只需排除 navbar-expand-* class，以便菜单始终在所有层上折叠。

测试版演示：https://www.codeply.com/go/HiMQd9taEd
Bootstrap 4.1.3: https://www.codeply.com/go/ugmj6XKY79

原始答案（Bootstrap 4 alpha）

在 Bootstrap 4 中，导航栏与 3.x 非常不同，它 总是折叠起来 除非被 navbar-toggleable 之一覆盖-* classes。您只需要确保您的导航栏不包含 navbar-toggleable-*.

<nav class="navbar navbar-fixed-top">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#collapsingNavbar">
        <span class="navbar-toggler-icon"></span>
    </button>
    <a class="navbar-brand" href="#">Navbar</a>
    <div class="navbar-collapse collapse" id="collapsingNavbar">
        <ul class="navbar-nav">
            <li class="nav-item active">
                <a class="nav-link" href="#">Home</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Features</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Wow</a>
            </li>
        </ul>
    </div>
</nav>

Alpha 演示：http://www.codeply.com/go/LN6szcJO53

Bootstrap 4：无论屏幕大小始终显示移动菜单按钮

Bootstrap 4: Always display the mobile menu button no matter screen size

css

navbar

twitter-bootstrap

bootstrap-4