如何向div添加滚动条？

I have a popup that displays some results, and I want a scroll bar to be display since the results are being cutt off (and I don't want the popup to be too long).

我有一个弹出窗口显示一些结果，我想要显示一个滚动条，因为结果被切断（我不希望弹出窗口太长）。

5 个解决方案

#1

You need to add style="overflow-y:scroll;" to the div tag. (This will force a scrollbar on the vertical).

你需要添加style =“overflow-y：scroll;”到div标签。（这将强制垂直滚动条）。

If you only want a scrollbar when needed, just do overflow-y:auto;

如果您只需要滚动条，只需要执行overflow-y：auto;

#2

Css class to have a nice Div with scroll

Css类有一个很好的Div与滚动

.DivToScroll{   
    background-color: #F5F5F5;
    border: 1px solid #DDDDDD;
    border-radius: 4px 0 4px 0;
    color: #3B3C3E;
    font-size: 12px;
    font-weight: bold;
    left: -1px;
    padding: 10px 7px 5px;
}

.DivWithScroll{
    height:120px;
    overflow:scroll;
    overflow-x:hidden;
}

#3

If you want to add a scroll bar using jquery the following will work. If your div had a id of 'mydiv' you could us the following jquery id selector with css property:

如果要使用jquery添加滚动条，以下内容将起作用。如果您的div的id为'mydiv'，您可以使用以下jssery id选择器和css属性：

jQuery('#mydiv').css("overflow-y", "scroll");

#4

<div class="scrollingDiv">foo</div> 

div.scrollingDiv
{
   overflow:scroll;
}

#5

<head>
<style>
div.scroll
{
background-color:#00FFFF;
width:40%;
height:200PX;
FLOAT: left;
margin-left: 5%;
padding: 1%;
overflow:scroll;
}


</style>
</head>

<body>



<div class="scroll">You can use the overflow property when you want to have better       control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better </div>


</body>
</html>

#1