在此之前，我们需要先简单了解CSS中的一种基本的定位和布局机制 -- 流。
流，是HTML中的抽象概念，隐喻这种排列布局方式像水流一样，自然流动。
即div等块级元素从上往下、span等行内元素从左至右排列的布局方式。
也就是说，流实现的总是方方正正，规规矩矩的效果。
1.浮动属性。
属性float 用来控制元素的浮动；
分别由left right none 代表左浮动，右浮动，不浮动；
img{ float:left;}
实现图片的向左进行浮动；一个设置成left,一个设置成right,就可以实现两边排列；
.box{ clear:left;}
使用clear可以清除浮动对页面造成的负面影响；
.box{ clear:both; }
使用both可以清除前面所有的浮动
2.溢出
默认情况下，溢出是可见的(visible)。设置overflow的属性的值为visible，表示对溢出的内容不做处理，内容会在盒子之外显示。
div{ overflow:visible; }
对选择器使用hidden可以隐藏溢出的内容；
div{ overflow:hidden; }
使用overflow: scroll;后，会添加滚动条，通过滑动滚动条可以查看元素中的所有内容。
div{ overflow:scroll; }
当然，设置overflow的属性的值为auto，只会在必要时添加滚动条。
1. 当内容溢出时，隐藏溢出内容，并添加滚动条；
2. 当内容没有溢出时，不会添加滚动条。
div{ overflow:auto; }
