z-indexnotworkingevenposition:absolute/relative

z-index 在 position 为 absolute 或 relative 时无效的技术性解法为：

此问题是由于 z-index 属性仅在具有“层叠上下文”的元素上有效，因此需将其设置为 position 值为 relative、absolute 或 fixed 的父级元素。如果没有可设置的父级元素，则需创建生成层叠上下文的容器，这些元素拥有以下任何属性：

• 根元素（即在 HTML 中）
• position 值为 relative/absolute/fixed 的元素
• position 值为 z-index 值不为 auto 的 flex 项目
• opacity 属性值小于 1 的元素
• mixin-blend-mode 或 filter 属性值不为 none 的元素
• 父级元素满足以上条件

以下是代码示例：

HTML 中创建父级元素，并设置 z-index 值：

<div class="parent-container" style="position: relative; z-index: 1;"> <div class="child-element" style="position: absolute; z-index: 2;"></div> </div>

CSS 中创建生成层叠上下文的容器：

.wrapper { position: relative; z-index: 1; }

.wrapper-child { position: absolute; z-index: 2; }