给DIV添加滚动条

我们都对div+css这个术语见得不算少了。今天遇到一个问题，在第三方平台上，页面大小已经固定。宽和高都是一个定值，但是我们的页面的信息量却远比这个高度要高很多。百度了一下，觉得可以通过两个方式解决。①、分页，按照数据的多少和高度做一个权衡 做分页效果。②、给装载的容器添加滚动条。即是，为页面的div添加滚动条。好，现在我们只要来说说为div添加滚动条的方法。东西不多，目的在于日后再遇此类问题就可方便查阅。

<div>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
<p>给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条，给div添加滚动条<p>
</div>

<div style='width:120px;height:140px;overflow-y:auto;
    overflow-x:hidden;'>
<p>给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，</p>
<p>给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，</p>
<p>给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，</p>
<p>给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，</p>
<p>给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，</p>
<p>给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，给DIV添加滚动条，</p>
</div>

①、

②、

图①②分别为上两种代码的效果。

除此之外 还可以设定一些滚动条颜色的样式，但是google的chrome与firefox无法识别这些属性，ie可以。同时有些ie版本在设置隐藏滚动条的时候需要将值设为0，一般情况下我们设置为：hidden。其次哈，有时候ie会有滚动滚动条不显示的情况出现，我们可以用两层div 将样式写在最外层同时将border与padding控制为0，这样几个浏览器将兼容。