Bootstrap 5 導覽列下拉問題:解決折疊功能
此討論解決了嘗試使用Bootstrap 建立響應式選單或下拉按鈕時遇到的挑戰5. 儘管合併了必要的導航和下拉圖標,但下拉式選單仍然沒有回應。此外,作者在使用其他 Bootstrap 類別(例如 mr-auto 和 ml-auto)時也遇到了困難。
這些問題的根本原因在於從 Bootstrap 4 到 Bootstrap 5 的過渡。 Bootstrap 5 引入了重大變化,包括將所有 JavaScript 插件的 data- 屬性替換為 data-bs- 屬性。此修改適用於各種 JavaScript 元件,包括 Collapse、Navbar、Carousel、Dropdown、Tabs 和 Modal。
為了解決下拉清單折疊問題,以下程式碼片段說明了正確的語法:
<button class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navbar"> <span class="navbar-toggler-icon"></span> </button>
這確保了資料屬性符合 Bootstrap 5 約定。
此外,Bootstrap 5 引入了新的類別來管理水平對齊,例如ms-auto和me-auto,它們取代了先前使用的ml-auto和mr-auto類。
以上是Bootstrap 5 導覽列下拉選單:為什麼我的下拉式選單不會折疊,如何修復它?的詳細內容。更多資訊請關注PHP中文網其他相關文章!