Question

无论屏幕尺寸如何，如何始终显示移动菜单按钮？我不希望在用户点击移动按钮之前显示链接。谢谢！

我意识到Bootstrap 3上有一篇帖子，但它不适用于Bootstrap 4.你能告诉我吗？

Answer 1

更新Bootstrap 4.1.x

排除navbar-expand*课程。

从测试版开始，navbar-toggleable-*类已替换为navbar-expand-*，但现在每个人都会向上移动一层。由于导航栏的默认状态始终为折叠/移动（xs），因此您只需排除navbar-expand-*类，以便菜单始终在所有层上折叠。

Beta演示：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- *类之一覆盖，否则始终折叠。您只需确保导航栏不包含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：无论屏幕尺寸如何，始终显示移动菜单按钮

1 个答案: