Bootstrap 導覽列：為什麼我的商標和選單項目在較小的裝置上消失？

Bootstrap 導覽列：解決小型裝置上消失的元素

設計帶有中心標誌和選單項目的Bootstrap 導覽列時，請確保跨裝置的最佳顯示。然而，用戶可能會遇到一個問題，即所有元素（包括徽標和漢堡菜單）在較小的螢幕上消失。

這種消失行為的根本原因通常與應用於導覽列的導覽列預設類別有關Bootstrap 的早期版本。雖然可能不會立即顯而易見，但此類對於設置背景顏色並使漢堡包圖示可見至關重要。

解 1：Bootstrap 5 和 Modern Bootstrap

在 Bootstrap 5 和現代版本中， navbar-default 類別已被取代。要顯示漢堡包圖標，您需要將 navbar-light 或 navbar-dark 類別新增至導覽列元素中。例如：

解決方案2：新增背景顏色（Bootstrap 4 及更早版本）

如果您使用的是Bootstrap 4 或更早版本，您可以解決透過向navbar-nav 元素添加背景顏色來解決此問題：

解決方案3：使切換器變暗（Bootstrap 4 及更早版本）

另一個選項Bootstrap 4 及更早版本是透過修改.icon-bar 類別來使切換器圖示變暗：

Bootstrap 3 的附加說明：

對於Bootstrap 3，必須包含導覽列預設類別才能正確對齊選單項目。

透過實作這些解決方案之一，您可以確保 Bootstrap 導覽列在所有螢幕尺寸上按預期顯示，無論裝置是什麼使用過。

以上是Bootstrap 導覽列：為什麼我的商標和選單項目在較小的裝置上消失？的詳細內容。更多資訊請關注PHP中文網其他相關文章！