Question

为什么z-index属性不能处理位置绝对的元素，如果此元素的父级位置已固定？我为这个案例制作了简单的example

HTML：

<div id='q1'>
  <div id='q2'></div>  
</div>

CSS：

#q1 {
  position: fixed;
  width: 100%;
  height: 50px;
  background-color: red;
  z-index: 0;
}

#q2 {
  position: absolute;
  top: 80%;
  border: 2px solid black;
  width: 100px;
  height: 30px;
  background-color: green;
  z-index: -1;
}

Answer 1

不能这样做，因为z-index相对于同一堆栈的元素，在您的情况下，您希望child的z-index低于parent的z-index。

顺便说一句，如果你不让＃q2成为＃q1的孩子，那么它就像魅力一样。

希望这个帮助

Answer 2

它与position属性无关，因为q2嵌套在q1

中

具有固定父级的绝对定位元素的z-index

2 个答案: