## 相对定位 #### 语法 ~~~ div{ position:relative; } ~~~ <br> #### 特性 * 不使元素脱离文档流（元素移动之后原始位置会被保留） * 如果没有定位偏移量，对元素本身没有任何影响 <br> <br> ## 偏移量 ~~~ div{ /* 往下偏移10px */ top:10px; /* 往左偏移 10px */ right:10px; /* 往上偏移 10px */ bottom:10px; /* 往右偏移 10px */ left:10px; } ~~~ <br> ## 绝对定位 #### 语法 ~~~ div{ position:absolute; } ~~~ <br> #### 特性 * 使元素完全脱离文档流，**有飞起来的感觉** * 使行内支持宽高 * 块级元素内容撑开宽度 * 如果有定位父级相对于定位父级发生偏移，没有定位父级相对于document发生偏移 **相对定位一般都是配合绝对定位元素使用！** <br> ## 层级 ~~~ div{ position:absolute; z-index:999; } ~~~ * 定位元素默认后者层级高于前者 * 层级高的会遮住层级低的 <br> ## 固定定位 ~~~ div{ position:fixed } ~~~ * 与绝对定位的特性基本一致，的差别是始终相对整个文档进行定位 <br> <br> <br>