div的overflow与使用CSS来修饰滚动条
用了css这么久，却很少用到overflow属性，虽然知道这个属性是用来设置div内容溢出的，但是也不知道实际的应用效果。今天看到篇文章，把它贴了过来。看了以后，学到不少。
即使页面上只有一个元素它也是一个矩形的盒模型。其大小、位置、行为都可以通过CSS来控制。这里的行为是指当盒模型内部以及周围的内容发生变化时的表现。例如，如果你没有给一个盒模型指定一个高度，那么它就会随着内容的增加变得越来越高。但是如果当你为盒模型指定一个高度、而其内部的内容不能与其完全匹配时又会怎么样呢？这时就要用到CSS中的overflow属性了，它允许你来设定如何处理多余的内容。
overflow有四个属性：visible（默认属性）、hidden、scroll和auto。此外它还有两个姊妹属性:overflow-x和overflow-y，这两个使用的相对较少。
让我们看看每个属性的具体使用方法。
Visible
如果你没有设定overflow属性，其默认值就是visible。因此，一般意义上说没有必要刻意声明其属性值为visible，除非是要覆盖基之前继承的属性。
需要注意的一点是，虽然盒模型内部的内容溢出到外围，但是不影响其它元素的浮动。
一般说来，对于内部有文本内容的盒模型来说不能简单地设定一个固定高度。
Hidden
和默认属性visible功能恰恰相反的属性是hidden，它会隐藏掉所有超出盒模型之外的内容。
对于动态内容和解决可能由于overflow影响布局的问题，它显得十分有用。但是，在大脑中一定要有这样一个意识，就是使用方法来隐藏文字不利于页面的可用性。例如，用户将默认字体设置到比你预计得要大时，就会有内容溢出，这些内容将会从用户的视野中消失。
Scroll
把overflow的值设为scroll，可以防止盒模型内的内容溢出到外围，但是它提供了一个滚动条，通过它可以查看盒内部的所有内容。
需要注意的是，设定此值后，在盒模型的水平、垂直两个方向都会出现滚动条，即使其内容只需要一个就足够了。
auto
overfollow的auto值和scroll差不多，不过它只在需要的时候才会出现滚动条。
浮动清除
最不可思议的是，使用overflow属性的多数情况不是为了处理溢出内容，而是用来清除浮动。设置overflow并不会清除元素本身的浮动，元素是自身来清除浮动的。这就意味着，设置了overflow属性（auto或者hidden）的元素，在其高度未设定的情况下会随着其内部浮动元素的增大而增大。
更多细节可以参照这篇 All About Floats.
