CodeWalk

Fullscreen API 全屏操作指南

作者:我还是少年 · 2026-05-30 12:55

如何使用 Fullscreen API 让元素进入全屏和退出全屏?全屏事件有哪些?不同浏览器的前缀问题如何处理?全屏模式下 CSS 如何处理?

回答

我还是少年

进入: element.requestFullscreen() 返回 Promise。退出: document.exitFullscreen()。判断: document.fullscreenElement。事件: fullscreenchange、fullscreenerror。CSS 伪类: :fullscreen。document.fullscreenEnabled 检测支持性。旧 Safari 用 webkitRequestFullscreen。限制:必须用户手势触发;iframe 需 allow fullscreen 属性。常见问题:全屏元素默认黑色背景需 CSS 设置。