必须同时添加 muted 和 autoplay 属性才能实现现代浏览器自动播放；ios 需额外加 playsinline 和 webkit-playsinline；youtube iframe 要带 mute=1&autoplay=1 且 allow="autoplay"；失败时需提供手动播放按钮。
必须加 muted，否则现代浏览器（Chrome、Safari、Firefox）基本不会自动播放——这不是代码写错，而是策略限制。
video 标签里 autoplay 和 muted 缺一不可
只写 autoplay 是无效的；浏览器看到有声视频会直接静音并暂停。只有同时声明 muted，才能触发自动播放逻辑。
-
autoplay是开关，但不是“强制播放”，而是“允许在满足条件时播放” -
muted是关键前提，它让浏览器判定该视频“不打扰用户” - 两者必须同时出现在同一
<video></video>标签中，顺序无关
移动端必须加 playsinline 和 webkit-playsinline
iOS Safari 默认强制全屏播放，哪怕你设了宽高也会跳出去。不加这两个属性，autoplay 在 iPhone 上大概率失效或被拦截。
-
playsinline：标准属性，告诉浏览器“请在页面内播放” -
webkit-playsinline：iOS Safari 专属兼容属性，必须显式写上 - 部分安卓 WebView（如微信内置浏览器）还可能需要
x5-playsinline
iframe 嵌 YouTube 视频要传 mute=1 和 allow="autoplay"
用 <iframe></iframe> 套 YouTube 或 Vimeo 时，autoplay=1 单独存在没用，必须配合静音参数和权限声明。
- URL 中必须带
mute=1&autoplay=1（注意 & 是 HTML 实体） -
<iframe></iframe>标签需含allow="autoplay"，否则 Chrome 等会拒绝执行 - YouTube 的
loop参数需额外加playlist=VIDEO_ID才生效，否则循环无效
自动播放失败时 fallback 到手动按钮
即使写了所有属性，某些场景（如用户首次访问、低功耗模式、隐私浏览）仍可能静默失败。不能只依赖自动播放。
- 监听
video的play事件，成功后可移除 loading 提示 - 监听
error或pause后长时间未playing，显示一个醒目的“点击播放”按钮 - 按钮点击后调用
video.play()，此时属于用户交互上下文，可安全取消muted并恢复声音
最易被忽略的是：iOS Safari 对 playsinline 的识别非常严格——如果父容器用了 transform、will-change 或某些 flex 布局，仍可能触发全屏。真遇到这种情况，得用 object-fit: fill + 固定宽高容器硬控尺寸，而不是靠 CSS 自适应。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
