如何在 Bootstrap 4 中创建两行导航栏？

具有 2 行的 Bootstrap 4 导航栏

在 Bootstrap 4 中，可以使用 Flexbox 实用程序类创建具有两行的导航栏。实现此目的的方法如下：

1. 将 flex-column 类添加到 .navbar-collapse div。这将垂直堆叠两个导航栏。

2. 在 .navbar-brand 元素上设置 flex-direction: column 属性。这会将徽标与导航栏链接垂直对齐。

3. （可选）您可以将 flex-row 类添加到第二个导航栏对齐图标水平。

这是代码的更新版本：

<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
    <div class="container">
        <button class="navbar-toggler navbar-toggler-right align-self-center mt-3" type="button" data-toggle="collapse" data-target="#navbarCollapse">
            <span class="navbar-toggler-icon"></span>
        </button>
        
        <h1 class="py-2 ml-lg-2 mx-3"></h1>
</div></nav>

以上是如何在 Bootstrap 4 中创建两行导航栏？的详细内容。更多信息请关注PHP中文网其他相关文章！