如何在 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中文網其他相關文章！