1.position:static
对象遵循常规流,top、right、bottom、left属性不会被应用。其最近的祖先元素的内容box边界构成包含块,祖先元素的display属性是以下之一:
- block
- inline-block
- list-item
- run-in
- table
- table-cell
2.position:relative
对象遵循常规流,并且依靠自身在正常流中的位置通过top,right,bottom,left属性进行偏移时不影响常规流中的任何元素。层叠通过z-index属性定义。其最近的祖先元素的内容box边界构成包含块,祖先元素的display属性是以下之一:
- block
- inline-block
- list-item
- run-in
- table
- table-cell
3.position:absolute
对象脱离常规流,使用top,right,bottom,left等属性进行绝对定位,盒子的偏移位置不影响常规流中的任何元素,其margin不与其他任何margin折叠,其层叠通过z-index属性定义。其包含块是最近的定位祖先元素——最近的祖先元素的position属性值是absolute、fixed或relative,那个祖先元素的填充边界构成包含块。设置此属性值会隐性地将元素的display属性改变成display:block。
4.position:fixed
对象脱离常规流,使用top,right,bottom,left等属性以窗口为参考点进行定位,当出现滚动条时,对象不会随着滚动。其包含块是视口或页面box。设置此属性值会隐性地将元素的display属性改变成display:block。