如何向div添加滚动条?

时间:2010-05-14 18:59:03

标签: css scroll popup

我有一个弹出窗口显示一些结果,我希望显示一个滚动条,因为结果被切断(我不希望弹出窗口太长)。

6 个答案:

答案 0 :(得分:91)

您需要将style="overflow-y:scroll;"添加到div标记。 (这将强制垂直滚动条。)

如果您只需要滚动条,请执行overflow-y:auto;

答案 1 :(得分:15)

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;
}

答案 2 :(得分:9)

如果要使用jquery添加滚动条,以下内容将起作用。如果你的div有一个“mydiv'你可以使用以下jssery id选择器和css属性:

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

答案 3 :(得分:5)

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

div.scrollingDiv
{
   overflow:scroll;
}

答案 4 :(得分:3)

<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>

答案 5 :(得分:0)

要添加滚动,您需要定义div的最大高度,然后添加 overflow-y

做这样的事情

.my_scroll_div{
    overflow-y: auto;
    max-height: 100px;
}