最近想给自己的工具增加点击全屏功能，但是发现全屏后都黑了。 我是这么全屏的:

// 全屏
    $(".main").on("click",()=>{
        document.body.requestFullscreen();
    });

但是发现元素都黑了，是因为全屏后背景自动黑了，所以啥也看不出来了，解决办法如下：

• 将白色固定为背景
• 并使用z-index将其向下推
• 将白色固定为html页面内容
• 并使用z-index将其向上推(在背景上方)\

它在Firefox和Chrome上有效

css:

::backdrop {
    z-index:0;  
    background-color: white !important;
}

html, *:fullscreen, *:-webkit-full-screen, *:-moz-full-screen {
    background-color: white !important;
    z-index:1;
}