z-index为负值时未被正确识别，元素未置于后方的问题求助

嘿，兄弟，我来帮你捋捋这个坑！当你给元素设了z-index: -1却没按预期被父元素盖住，大概率是堆叠上下文在搞鬼，这可是z-index最容易踩的坑之一~

先给你拆解几个核心排查点：

• 先看父元素有没有设置position属性（比如relative/absolute/fixed/sticky）？如果父元素自己创建了堆叠上下文，那子元素的z-index只会在这个上下文里生效，哪怕设成-1也跑不到父元素外面的层级去。
• 检查父元素有没有transform/filter/perspective这类属性，这些属性会偷偷触发堆叠上下文，直接把子元素的层级锁在父元素内部。
• 还有一种情况：如果父元素的overflow设成了hidden/scroll，也可能会限制子元素的堆叠范围。

给你个快速验证方法：打开浏览器F12开发者工具，选中那个城市元素，看右侧的「层级」面板，就能清楚看到它的父元素有没有创建独立的堆叠上下文。要是还是搞不定，把相关的HTML结构和CSS代码贴出来，我再帮你细抠~

备注：内容来源于stack exchange，提问作者ricardorios