Css 是否可以使用相同的图标打开和关闭模式？

我想知道我是否可以使用“相同”图标（或看起来相同的东西）来触发全屏半透明引导模式（我已经定制）弹出，然后用位于相同位置的图标关闭它

但是，假设它最初是普通页面上的一个汉堡图标，当我单击图标弹出模式菜单时，它现在位于模式下。有没有办法让它保持在模态的顶部？我试过z-index，但没能成功

对我来说，棘手的是，我想让图标从汉堡包转换为X，然后在关闭时从X转换为：

起初，我希望我能让图标转换，然后以某种方式将图标设置为层在一切之上，包括情态动词

---

任何想法或建议都很好，谢谢。

使用z-index应该可以做到这一点。但是，z-index仅适用于将“位置”设置为“静态”（默认值）以外的值的元素。尝试将

position:relative

添加到打开/关闭按钮中，希望您能够使用z-index将按钮保持在覆盖的前面

---

有一个很好的参考，提供了更多关于z-index的信息。

hmm，我在导航栏上添加了一个固定位置和高z-index（这是我想放在所有东西上面的），然后模态有一个相对位置，但它仍然不工作……这可能是嵌套的问题吗？如果按钮位于覆盖层后面的元素内，则无论在其上放置了什么z索引，它都不能位于覆盖层前面。CSS技巧页面更详细地解释了这一点。