:fullscreen伪类必须绑定到调用requestfullscreen()的具体元素上，且需兼容各浏览器前缀，退出后样式不会自动还原，须配合fullscreenchange事件和document.fullscreenelement判断。
:fullscreen 伪类不能直接写成 :fullscreen 独立使用，它必须绑定到具体被全屏的元素上，否则现代浏览器会忽略该规则。
必须用实际触发全屏的元素选择器
浏览器只对调用 requestFullscreen() 的那个 DOM 节点应用 :fullscreen 样式。比如你对 document.getElementById('player') 调用了全屏，CSS 就得写 #player:fullscreen，而不是 .video-player:fullscreen（除非该元素真有这个 ID 或 class）。
- 检查
document.fullscreenElement的值，确认当前全屏的是哪个节点 - 标签名、ID、class 必须完全匹配；
video:fullscreen不会匹配<div class="video"> <li>避免 <code>body:fullscreen或div:fullscreen这类宽泛写法——body 几乎从不进全屏，浏览器可能直接跳过 - 子元素不会继承
:fullscreen，要改控件大小得写video:fullscreen .controls - 标准写法：
.player:fullscreen - WebKit 版本：
.player:-webkit-full-screen（注意是双冒号::和两个连字符-） - Mozilla 版本：
.player:-moz-full-screen（moz小写） - IE/旧 Edge：
.player:-ms-fullscreen（已基本可忽略） - 不要混用写法，比如
.player::-webkit-full-screen是错的（三冒号） - 正确做法：先定义基础样式
.player { padding: 20px; }，再用:fullscreen增量调整 - 需要动态响应进出，建议监听
fullscreenchange事件，配合 class 切换或 JS 控制 - 注意事件名是
fullscreenchange，不是fullscreenchanged -
requestFullscreen()是异步的，不能在调用后立刻读document.fullscreenElement - 关键功能不能依赖
:fullscreen，必须用fullscreenchange+document.fullscreenElement做兜底判断 - iframe 中使用需确保
allow="fullscreen"属性存在且同源 - 用户手势必须同步触发
requestFullscreen()，包在setTimeout或Promise.then里会静默失败 - 页面未聚焦、跨域 iframe、自动播放策略干扰，都可能导致全屏调用失败，样式自然不生效
兼容旧版浏览器必须并列声明前缀版本
Chrome/Edge 71 前、Firefox 64 前、Safari 15.4 前都不支持无前缀 :fullscreen。漏掉任一版本，对应浏览器就失效。
退出全屏后样式不会自动还原
:fullscreen 是单向覆盖，不是状态开关。如果你只写了 .player:fullscreen { padding: 0; }，退出后 padding 仍为 0。
iOS Safari 和部分移动端根本不用指望它
iOS Safari 完全不支持标准 :fullscreen，也不支持 ::-webkit-full-screen（仅支持 video.webkitEnterFullscreen() 这类专属 API）。Android Chrome 虽支持，但某些 WebView 可能阉割。
真正麻烦的不是写法，而是它和 JS 全屏 API 的耦合深度——选错一个选择器、漏一个前缀、少一次事件监听，整套逻辑就断在看不见的地方。
