controlslist="nofullscreen" 无效是因为它仅在iOS Safari(10+)和部分Android Chrome(75+)中生效,且必须配合playsinline和webkit-playsinline使用;桌面端Chrome、Firefox、Edge完全忽略该属性。

controlslist="nofullscreen" 为什么没效果
直接写 controlslist="nofullscreen" 很大概率无效——这不是浏览器支持问题,而是它只在特定条件下起作用:必须配合 webkit-playsinline 和 playsinline 属性使用,且仅对 iOS Safari 和部分 Android Chrome 生效。桌面端 Chrome、Firefox 完全忽略该属性。
哪些浏览器真正支持 nofullscreen
目前只有:
- iOS Safari(10+):需同时设置
playsinline和webkit-playsinline - Android Chrome(75+):仅当视频嵌入 WebView 或 PWA 场景下部分生效,普通网页不保证
桌面端所有主流浏览器(Chrome/Firefox/Edge)均不解析 controlslist 中的任何值,包括 nofullscreen、nodownload 等。
真正能隐藏全屏按钮的实操方法
靠 HTML 属性不行,得用 CSS + JS 组合压制:
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML,替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度,HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记(深入)”;
- 用
::-webkit-media-controls-fullscreen-button伪元素隐藏按钮(仅 WebKit 内核) - 对非 WebKit 浏览器(如 Firefox),用
video::-moz-fullscreen-button(但 Firefox 实际不暴露该伪元素,只能退而求其次) - 最可靠方式:移除原生 controls,自定义控件;或用
document.exitFullscreen()+video.addEventListener("fullscreenchange", ...)主动退出 - 关键补丁:给
<video>加disablepictureinpicture,否则 PiP 按钮可能替代全屏入口
示例 CSS(仅限 Safari):
video::-webkit-media-controls-fullscreen-button {
display: none !important;
}
为什么禁用全屏按钮这么难
因为全屏是浏览器级权限行为,HTML 标准从未赋予开发者“禁用 UI 元素”的能力,controlslist 是厂商实验性扩展,不是规范。iOS 强制要求视频默认 inline 播放,所以才开放了有限控制权;安卓和桌面端坚持“用户主权”,不允许网页剥夺全屏入口。
真正要阻止全屏,唯一稳定路径是不用原生 controls,自己画一套控件,并全程接管 requestFullscreen() 调用——但这也拦不住用户右键菜单或快捷键(F11)。别指望纯 HTML 解决。


















