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;         
}

 

posted @ 2019-03-19 15:14  Embrace_LY  阅读(283)  评论(0编辑  收藏  举报