设置了z-index为什么不生效

Question

如图明明设置了z-index，为什么弹框的菜单还是被遮挡的？

Answer 1

假设有以下5个元素

<div class="A">
  <div class="a">
  </div>
</div>
<div class="B">
  <div class="b">
  </div>
</div>

A的z-index如果小于B的z-index， 那么无论a 的z-index 多大，都不会遮盖到B和b
建议仔细看看这篇文章https://www.zhangxinxu.com/wo...

Answer 2

z-index本质上是层叠上下文的问题，不仅仅是z-index会影响元素的层级展现，附上MDN链接，看看就很清楚了。
层叠上下文