【发布时间】：2013-09-02 17:28:07
【问题描述】：
当我“全屏”一个元素（比如说一个 div）时，我无法让任何其他元素出现（在全屏模式下）。为什么会这样？我怎样才能做到这一点？
相关：Is there a way to overlay a <canvas> over a fullscreen HTML5 <video>?
【问题讨论】：
标签： html css z-index fullscreen
【发布时间】：2013-09-02 17:28:07
【问题描述】：
似乎浏览器（Chrome 28、Firefox 23）将全屏元素的z-index 设置为 2147483647（最大的 32 位有符号数）。根据测试，将其他元素的z-index设置为相同的z-index会导致它们显示，但全屏元素的z-index不能更改（可以，但浏览器只是忽略该值-甚至使用 !important)。
也许我能找到的唯一参考：
https://github.com/WebKit/webkit/blob/master/LayoutTests/fullscreen/full-screen-zIndex.html
另外，在 Chrome 开发工具中：
所以要么将元素设置为最大z-index，或者，更好的解决方案是只创建一个容器元素，让你想要显示的所有元素都是容器元素的子元素，然后全屏显示。
【讨论】：
-
当我尝试这个时，它只适用于 Chrome，而不是 Firefox 或 IE11，尽管全屏元素的 z-index 在所有三个中都设置了。
-
同样如此，3 年后。
-
这是 Firefox 解决方案：stackoverflow.com/questions/45798213/…
-
在 Chrome 更新到 v.69 之后，这个解决方案（也是我自己实现的）将不再起作用，因此更好的一个似乎可以正常工作的是 Dalibor 提供的 Firefox。跨度>