文档流
所谓文档流就是按照元素的顺序从左到右，由上而下的方式排列
定位
默认的文档流很多时候不能满足我们的要求，那么我们就需要更多的、
更丰富的布局手段，这个时候就需要定位了
定位方式有static、fixed、relative、absolute
static静态定位（默认）
无定位，元素正常出现在流（文档流）中
不受left，right，top，bottom的影响
Relative相对定位
absolute绝对定位
Fixed固定定位
z-index
为了处理样式重叠事件，我们需要用到z-index
数值越大，等级越高（999）
定位总结
（1）标准文档流按照从左到右，由上到下的方式排列元素
如果想要改变默认的布局方式，就需要用到relative,
Absolute,fixed等定位方式
（2）relative是相对于原来的位置进行偏移
（3）absolute是相对于它的父容器（上一级）进行偏移
但是它的父容器也必须不是默认定位（static），否则的话
会一直顶到网页的最顶部
（4）fixed是相对于整个页面进行偏移
（5）relative不会从标准文档流里脱离，但是absolute和
Fixed是都会从文档流里脱离出来
4.3浮动
通过设置float使得元素从原本的文档流里脱离出来
感觉像浮在原本的文档流上面，所以叫它浮动
案例：
代码实现