以下是文章的一些標題選項，請記住問答格式和內容： 直接、簡潔： * Bootstrap 中的可滾動式選單：如何修復容器擴充功能？ * 噓

使用 Bootstrap 的可捲動選單：解決選單擴充問題

之前嘗試使用 Bootstrap 實作可捲動選單導致選單擴充其容器。這種行為是不可取的，特別是與不出現此問題的不可滾動選單相比。

解決策略

要解決這個問題，有兩種方法主要做法：

1.更新CSS 屬性

只需將特定CSS 屬性新增至可捲動選單類別即可解決問題。

<code class="css">.scrollable-menu {
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}</code>

2.利用 Bootstrap 更新

Bootstrap 隨著時間的推移不斷發展，引入了對下拉標記的更改。根據目前版本更新標記和 CSS 可以確保相容性並解決問題。

對於Bootstrap 5：

<code class="css">.dropdown-menu {
    max-height: 280px;
    overflow-y: auto;
}</code>

對於Bootstrap 4：

<code class="css">.dropdown-menu {
    max-height: 280px;
    overflow-y: auto;
}</code>

對於Bootstrap 4：

對Bootstrap 4：

此替代選單佈局利用Flexbox 進行選單設計。它提供了一種在 Bootstrap 框架內建立可捲動功能表的不同方法。

以上是以下是文章的一些標題選項，請記住問答格式和內容： 直接、簡潔： * Bootstrap 中的可滾動式選單：如何修復容器擴充功能？ * 噓的詳細內容。更多資訊請關注PHP中文網其他相關文章！