今天复习了一下css的position属性，作为css中比较重要的属性，如果使用得当，那么页面布局将如虎添翼。它具有几个属性值，其区别如下：
| 值 | static | fixed | relative | absolute | inherit |
|---|---|---|---|---|---|
| 定位 | 无定位（默认值） | 绝对定位（相对于浏览器边框） | 相对定位（相对于其正常位置进行定位） | 绝对定位（相对于 static 定位以外的第一个父元素进行定位） | 继承父元素的position属性值 |
| 是否脱离文档流 | 否 | 是 | 否 | 是 | 继承父元素的position属性值 |
特别地：
position: absolute 的定位，相对于 static 定位以外的第一个父元素进行定位，其理解为：
如果想要一个子元素相对于其父元素进行定位，则父元素应设置position为除了默认值static以外的值（如果为inherit则继承的值应为除了static以外的值），例如：子元素A希望相对父元素B进行定位，则将父元素B设置为position: relative;
如果父元素没有设置position属性，或者说设置为static（虽然一般没人这么无聊），那么该子元素则相对于层层向外遇到的第一个position不为static的父元素定位。
position: absolute对于用margin或者padding不好定位的情况有奇效。
网友评论