标准答案
- controls 显示浏览器原生控制条,autoplay 尝试自动播放,muted 静音,loop 循环播放。
- preload 控制浏览器是否预加载媒体,常见值有 none、metadata、auto。
- poster 给 video 设置播放前封面,playsinline 常用于移动端内联播放。
- 移动端和现代浏览器通常禁止有声自动播放,静音视频更容易被允许。
- 真实项目要提供手动播放入口,并处理自动播放失败的 Promise。
题目解析
这题重点是浏览器策略,不是背属性列表。自动播放受用户手势、省流量、系统设置和浏览器策略影响。
preload 也不是强制命令,浏览器可以根据网络和设备策略自行决定。
代码示例
移动端背景视频通常会静音并声明 playsinline。
HTML
<video
src="/intro.mp4"
poster="/intro-poster.jpg"
autoplay
muted
loop
playsinline
></video>常见误区
- 认为写了 autoplay 就一定会播放。
- 忘记给视频提供 poster,首屏出现黑块或空白。
- 为了首屏效果 preload 大视频,拖慢关键内容加载。