CSS：

Question

我至少有一个很长的子菜单，另一个很好。它在桌面和移动设备上看起来很好但我想让这些子菜单可滚动，这样它就不会太长和/或压倒人。

我还没有使用JavaScript，所以我需要一个简单的CSS技巧。我最接近的地点就在这里：

但它会将所有内容组合在一起，只显示最后一个菜单项。我试过把它做得更久但似乎没什么用。

CSS：

.navbar-inverse .dropdown-menu > li > a {
  width: 185px;
  height: 400px;
  overflow-x: hidden;
  overflow-y: scroll;
  z-index: 1000 !important;
  position: fixed !important;
}

有什么建议吗？

partyfavorz.com

Answer 1

为了让div可以垂直滚动，你需要有一个比正在滚动的div更小的父级。

.parent {
    height: 300px;
    width: 300px;
    overflow-y: auto;
}

.scrollable {
  height: 600px;
  width: 300px;
  background: gray;
}

您可以在链接https://jsfiddle.net/sebdum/npz8u6x2/1/

上看到该示例

Answer 2

只需为List设置一个高度并溢出-y：

.dropdown-menu {
     height: 500px; // change it as you like
     overflow-y: auto;
}

如何使子菜单可滚动

CSS：

2 个答案: