z-index默认值
默认值为:0
z-index有效性
首先我们的定位position有5个值:static,relative,fixed,absolute,sticky
z-index在position为static时,不起作用。对于float元素也不起作用。
z-index嵌套问题
记住一句话:先拼爹再拼自己
父级如果比不过,自己再怎么努力也没用,还是在别人下面(像极了我们现在的状况)。
关于不同定位的层级问题
我们知道,relative不会脱离文档流,但你用top,left等定位拉的时候,它是会覆盖在static上的。所以可以理解为,实际relative也是脱离了文档流的,只不过文档流会给他留位置而已。(虽然我不在,位子不准占我的)
插一句嘴:absolute是找第一个不是static的作为父容器
关于relative和absolute,如果是同一父子级别。谁z-index大谁厉害,如果z-index也一样,谁在dom结构中位置靠后谁厉害(简单点说,后写的覆盖先写的)。
fixed本来就是根据视窗在定位,跟relative和absolute就不在一个层面玩,一般是覆盖在比较上层的。(个人感觉fixed根据视窗定位,父级别比较高,它的z-index是跟html的根级z-index比较的,它能覆盖根层,那些在html根层内的就都干不过它了)