Bootstrap 3 - 可滚动的内容 div

Posted 2023-03-05

【中文标题】Bootstrap 3 - 可滚动的内容 div

【英文标题】：Bootstrap 3 - Scrollable content div

【发布时间】：2013-11-09 16:55:54

【问题描述】：

我正在使用 Bootstrap 3，并且正在尝试制作可滚动的内容 DIV。 我有一个带有左侧导航和顶部栏的网格，在 中间我有应该可以滚动的内容。

当我在内容 div 上使用固定高度时它可以工作......但我想要 改为使用 100%。

<div  class="col-lg-12 col-md-12 col-sm-12" style="height:100%;overflow-y:auto;">
some content...
</div>

CSS：

html,body

 height:100%;
 overflow:hidden;

我怎样才能让它与 height:100% 一起使用；

谢谢！

【问题讨论】：

overflow-y: 滚动是否适合您？抱歉没有在我的手机上测试过

我在上面的代码中没有在内容 DIV 中得到任何垂直滚动条...所以 overflow-y 似乎没有帮助。

嗯。再次阅读您的帖子后，我只是想检查一下您是否需要一个可滚动的 div，或者您只是想让您的左侧导航和顶部导航固定，而页面的其余部分移动类似于 boostrap 文档页面？

【参考方案1】：

您可以为要滚动的 div 添加 pre-scrollable 类。

如果你搜索 .css 有一个 ma​​x-height 但你不能编辑。因此，您确定它将最大化窗口中的页面以获得该最大值。

希望对您有所帮助，我在带有可滚动 div 的单页中使用了相同的方法。

【讨论】：

这对我有用，例如