如何自动添加垂直滚动条到我的 div？

我想添加一个垂直滚动条到我的 <div>。我试过 overflow: auto，但是没有用。我已经在 Firefox 和 Chrome 中测试了我的代码。

我在这里粘贴 div 样式代码:

float: left;
width: 1000px;
overflow: auto;
494588 次浏览
小开

您需要分配一些高度来使 overflow: auto;属性正常工作。
为了测试的目的，添加 height: 100px;并检查。
如果给 overflow-y:auto;而不是 overflow: auto;会更好，因为这样元素只能垂直滚动，而不能水平滚动。

float:left;
width:1000px;
overflow-y: auto;
height: 100px;

如果您不知道容器的高度，并且希望在容器达到固定高度时显示垂直滚动条，比如 100px，则使用 max-height而不是 height属性。

有关更多信息，请阅读此 MDN 文章 。

小开

我不太确定您试图使用 div 来做什么，但是这是一个带有一些随机文本的示例。

格林先生给出了正确的指示，当他说，添加 overflow-y: auto，因为这限制了它的垂直滚动。这是一个 JSFiddle 的例子:

JSFiddle

小开

要在 div 中显示垂直滚动条，需要添加

height: 100px;
overflow-y : scroll;

或者

height: 100px;
overflow-y : auto;
小开

必须添加 max-height属性。

.ScrollStyle
{
max-height: 150px;
overflow-y: scroll;
}
<div class="ScrollStyle">
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
Scrollbar Test!<br/>
</div>

小开

我的 div-popup上有一个很棒的滚动条。要应用这个样式，可以把它添加到 div 元素中:

overflow-y: scroll;
height: XXXpx;

指定的 height将是 div 的高度，如果有内容超过这个高度，则必须滚动它。

谢谢你。

小开

自 OS X Lion 以来，网站上的滚动条默认是隐藏的，只有当你开始滚动时才能看到。就我个人而言，我更喜欢隐藏滚动条，但是如果你真的需要它，你可以覆盖默认设置，强制 WebKit 浏览器中的滚动条像这样返回:

::-webkit-scrollbar {
-webkit-appearance: none;
width: 7px;
}
::-webkit-scrollbar-thumb {
border-radius: 4px;
background-color: rgba(0,0,0,.5);
-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

小开

对我来说

自动垂直滚动

overflow-y: scroll;
overflow-x: hidden;

提交答案