遮罩层没盖住内容通常因未设置定位属性导致z-index失效，需设position:fixed/absolute并确保无父级层叠上下文干扰，同时z-index值应显著高于目标元素且body滚动需禁用。

遮罩层没盖住内容，通常不是 z-index 没设，而是它没生效——z-index 只对定位元素（position 值为 relative/absolute/fixed/sticky）起作用。

检查遮罩层是否设置了定位

即使写了 z-index: 9999，如果遮罩层的 position 是默认的 static，z-index 就完全被忽略。

• 给遮罩层加上 position: fixed（推荐，全屏覆盖且不随滚动偏移）或 position: absolute
• 示例：

  .mask {
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.5);
    z-index: 9999;
  }

确认父容器没有创建新的层叠上下文

如果遮罩层的某个祖先元素设置了 position: relative + z-index（哪怕只是 1），它就可能成为新的层叠上下文，导致子级的 z-index 只在该上下文内比较，无法压过同级其他模块。

• 用浏览器开发者工具（Elements 面板）逐级查看遮罩层的父节点，看是否有 z-index、opacity 、transform、filter 等会触发新层叠上下文的样式
• 临时移除可疑父元素的 z-index 或 transform，观察遮罩是否恢复正常

对比目标内容的层叠层级

被遮罩的内容本身也可能有较高的 z-index，或者它的父容器已形成更强的层叠上下文。

• 检查内容区域及其祖先是否设置了 z-index（尤其 Modal、Header、Fixed Nav 等常用组件）
• 确保遮罩层的 z-index 数值明显高于所有可能干扰它的元素（比如设成 9999，而内容区是 999）
• 避免使用过小的 z-index（如 10、100），不同框架/组件库常自带 z-index 基线（Bootstrap 的 modal 是 1050，Ant Design 是 1000）

补充：固定定位需注意 body 滚动问题

用 position: fixed 的遮罩虽能稳居顶层，但如果页面本身可滚动，有时会因 body 未禁用滚动导致遮罩下仍有内容可见。

• 弹出遮罩时，给 加上 overflow: hidden
• 关闭遮罩后记得恢复 overflow: auto 或原有值（可用 class 切换控制）