CSS position属性学习

position属性决定了html元素在页面中的定位方式以及定位的参照对象。

static 定位方式：静态定位(默认值)，默认文档流，依据默认文档流中元素的顺序依次排列；

absolute 绝对定位，定位文档流，相对于非static定位的父元素进行定位；

relative 相对定位，定位文档流，相对于自身在默认文档流中的位置进行定位；

fixed 固定定位，定位文档流，相对于浏览器视口进行定位。

 

position定位布局：

定位控制,定位层对象可以通过4个方向属性来控制定位： top bottom left right 。

4个方向属性仅对定位层对象生效，静态定位元素无效。

4个方向属性用来控制的是距离，值带单位，可以为负值。

同轴方向属性设定有冲突时，top、left优先。

定位文档流的顺序控制：

z-index规定定位元素的堆叠顺序，拥有更高顺序的元素总是会处于较低顺序的元素的前面，

z-index属性仅对定位层对象生效，用来控制对象的定位文档流层叠关系，

z-index默认值为0，正值越大，层叠级别越高，z轴上越靠前。