CSS中position使用的个人总结
position属性有:
static
relative
absolute
fixed
偏移属性有:
top,left,bottom,right, z-index(不属于偏移属性)
position属性:
static
static是静态定位,对象遵循标准文档流,这个属性是默认的,不可以应用偏移量属性(top,left,bottom,right)。
relative
relative是相对定位,对象遵循标准文档流,在文档流中占位置,并且参照自己在标准文档流中的位置,通过top,left,bottom,right定位偏移属性来进行位置偏移时,是不会影响文档流中的其他元素。
absolute
absolute是绝对定位,对象脱离标准文档流,不占文档流的位置,此时的偏移属性参照的是离自身最近的定位的祖先元素,若无,则一直追溯到body元素。盒子使用偏移属性进行位置偏移时不影响标准文档流中的其他元素,其margin不与其他元素的margin重叠。
fixed
fixed是固定定位,对象脱离标准文档流,但是偏移定位是以窗口为参考,有滚动条出现时,不随滚动条移动。
说下z-index:
z-index
z-index是设置元素的堆叠顺序,所有元素都有z-index属性,具有权值比较,默认权值是0,哪个元素的权值越大,哪个元素就被堆叠到上面。
补充:
relative和absolute是一般是一起搭配使用的,一般父元素设置relative属性,子元素设置absolute属性,子元素参考父元素偏移。