Bootstrap 5 導覽列下拉問題
嘗試使用Bootstrap 5 實現響應式導航選單時,使用者可能會遇到下拉式選單的問題或選單項目無法如預期運作。即使專案中包含 jQuery,也可能會出現此問題。
原因
在 Bootstrap 5 中,JavaScript 外掛程式的 data-* 屬性已變更。之前使用的是 data-toggle 和 data-target,但在 Bootstrap 5 中,它們已分別替換為 data-bs-toggle 和 data-bs-target。
解決方案
要解決此問題,請將舊的 data- 屬性替換為新的data-bs-屬性:
<button>
其他注意事項
除了data-* 屬性的變更之外,Bootstrap 5 還引入了其他變更。例如,ml-auto 和 mr-auto 類別已替換為 ms-auto 和 me-auto。
示範
此程式碼片段示範了功能下拉清單按鈕:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Bootstrap</title> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous" /> </head> <body> <nav>
以上是為什麼我的 Bootstrap 5 導覽列下拉選單即使使用 jQuery 也不起作用?的詳細內容。更多資訊請關注PHP中文網其他相關文章!