微信iOS内联播放需同时写全playsinline、webkit-playsinline、x5-playsinline="true"且muted必须硬编码在HTML中，播放须由用户手势触发，父级CSS如overflow: hidden或transform会破坏内联。
微信 iOS 必须同时写全三个 playsinline 相关属性
只写 playsinline 在微信 iOS 里大概率失效。它用的是 Safari WebKit 内核，但会额外过滤掉不完整的声明。必须硬编码在 HTML 中、一次写齐：playsinline、webkit-playsinline、x5-playsinline="true"。漏掉任意一个，旧版 iOS（如 12–14）或微信 8.0.30 之前版本就直接忽略。
常见错误写法：<video playsinline muted> —— 缺 webkit-playsinline 和 x5-playsinline<video x5-playsinline="true" muted> —— 安卓可能认，iOS 不认
正确写法示例：<video controls playsinline webkit-playsinline x5-playsinline="true" muted>
muted 是硬性前提，不能靠 JS 动态设置
iOS 和微信 WebView 把 muted 当作播放上下文合法性校验的第一道门槛。如果标签里没写 muted，哪怕 JS 执行 video.muted = true 再调 play()，Safari 仍判定为“非安全上下文”，强制跳全屏。
-
muted必须作为布尔属性出现在初始 HTML 中，例如<video muted>或<video muted=""> - 若需后续开启声音，应在用户点击后调
video.muted = false，此时已处于用户激活状态，不会触发降级 - 用
autoplay时，muted是强制要求；不用autoplay也建议带上，提升内联成功率
播放必须由真实用户手势触发，不能脱离事件栈
即使属性全、静音也到位，JS 调用 play() 时若不在用户手势执行栈中，iOS 仍会拒绝内联。典型失效场景：
- 在
window.onload、DOMContentLoaded或fetch回调里直接调play() - 用
setTimeout延迟调用，哪怕只延 1ms，也会跳出手势上下文 - 监听
document上的委托 click，但实际event.target是个<span>，不是可交互元素 - 在
touchend后立刻play()，部分 iOS 版本因防误触机制丢弃该上下文
稳妥做法：<button onclick="video.play()">播放</button>
或监听按钮的 click 事件，在 handler 内调 play()，确保 event.target 是 button 或其直接子元素。
父容器 CSS 是隐形杀手，尤其微信安卓
很多页面反复检查 HTML 属性无误，最后发现是 CSS 暗中破坏了内联能力。微信 X5 内核（安卓）和 Safari（iOS）对某些样式极其敏感：
立即学习“前端免费学习笔记（深入）”；
-
overflow: hidden写在<video>的任意父级上 → 触发渲染层降级，x5-playsinline失效 -
transform: translateZ(0)、will-change: transform、perspective→ iOS 认定为“非标准布局”，禁用内联 -
object-fit: cover+width: 100%组合 → X5 内核判定为“非标准容器”，强制全屏 - 未设明确宽高（如只写
style="width:100%"，无height）→ 微信 iOS 可能 fallback 全屏
建议：给 <video> 设置固定 height（哪怕 height="200px"），避免依赖父容器拉伸；移除所有非必要 transform 和 overflow 样式。
最易被忽略的一点：属性必须写在初始 HTML 字符串里，JS 动态插入 video 元素时，innerHTML 或 appendChild 创建的节点，若没把 playsinline 等属性一并写进字符串，iOS 就根本不识别——它只在 DOM 解析阶段读取这些属性，之后补加无效。
