z-index注意事项

1. z-index只对定位元素有效(如position:absolute!)

2. 被覆盖的元素将无法触发其鼠标相关事件。(个人经验,可能有例外。)

3. 无法通过z-index使父级覆盖子级,如果子级z-index为0,那么父级就是200000也不会覆盖住子级。

4. 如果想要父级覆盖子级,那么父级不需要设置z-index,只要孩子设置z-index就可以了。如下:

html
<
div id="father"> <div id="child“></div> </div>
css
#father{
  width:400px;
  height:300px;
  position:absolute;
  background:red;          
}
#child{
  width:200px;
  height:200px;
  position:absolute;
  background:black;   
  z-index:-1;         
}
原文地址:https://www.cnblogs.com/embrace-ly/p/10558857.html