如何防止桌面上的 Bootstrap 響應式選單自動關閉？

Bootstrap 中的響應式選單自動關閉

問題：

問題：

在Bstrap. ，當點擊「產品」按鈕時，響應式選單會開啟一個白色欄。然而，當網站處於桌面模式時，點擊按鈕會無意中縮小選單。

解決方案：

<li><a href="#Products" data-toggle="collapse" data-target=".navbar-collapse">Products</a></li>

為防止在桌面上點擊時選單折疊，避免添加額外的 JavaScript。相反，修改選單清單項目以包括資料切換和資料目標選擇器。例如：

對每個選單項目重複此步驟。

修復溢位問題的擴充解決方案：

<li><a href="#products" class="hidden-xs">Products</a></li>
<li><a href="#products" class="visible-xs" data-toggle="collapse" data-target=".navbar-collapse">Products</a></li>

解決溢位和閃爍問題問題，請合併以下程式碼：

這使得切換和目標選擇器特定於螢幕尺寸，消除較大螢幕上的故障。

引導程式版本相容性： 請注意，Bootstrap 版本 4.1.3 和 5.0 中已棄用可見/隱藏類別。使用 d-none d-sm-block 取代hidden-xs，使用 d-block d-sm-none 取代visible-xs。在 Bootstrap 版本 5 中，將 data-toggle 替換為 data-bs-toggle，將 data-target 替換為 data-bs-target。

以上是如何防止桌面上的 Bootstrap 響應式選單自動關閉？的詳細內容。更多資訊請關注PHP中文網其他相關文章！