版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
###定位方式 4+1
####position定位
-
**静态定位（文档流定位）**默认： static， 块级元素从上到下排列，行内元素从左向右排列，元素的位置通过元素的外边距控制。
- 相对定位：relative，元素不脱离文档流，通过left/right/top/bottom从元素初始位置做位置偏移
当元素需要改变位置，并且其它元素不受影响的情况使用相对定位 -
绝对定位：absolute， 元素脱离文档流，通过left/right/top/bottom移动元素，元素坐标相对于窗口(默认)或某一个上级元素
当元素需要改变位置，并且不希望保留原来的位置时使用绝对定位
- 固定定位：fixed， 元素脱离文档流，通过left/right/top/bottom移动元素，元素坐标只相对于窗口。
当元素需要固定在窗口的某个位置时使用固定定位
####浮动定位
- 脱离文档流，元素从当前所在行向左或向右浮动，当撞到上级元素边框或其它浮动元素时停止
- 浮动元素一行装不下会自动换行，换行时有可能被卡主
- 当元素上面有其它元素浮动后则元素会顶上去，如果不希望元素往上移动可以给元素添加clear属性。
- 当元素的所有子元素全部浮动后，自动识别的高度为0，可以通过给元素添加overflow：hidden解决此问题。
- 通过外边距控制元素位置
- 当需要把纵向排列的元素改成横向时使用浮动定位
###溢出设置overflow - hidden ：超出范围不显示
- visible（默认）：超出范围显示
- scroll：超出范围滚动显示