标签需确保src为http可访问路径、禁用本地file://协议；富文本编辑器中需启用html标签过滤豁免；多格式按顺序匹配首个兼容type；移动端autoplay必须加muted和playsinline。
直接用 <video></video> 标签插入，但必须确保路径可被 Web 服务器解析，不能用本地文件系统路径（如 file:///）；否则控制台报 net::ERR_FILE_NOT_FOUND 或静默失败。
编辑器里粘贴 <video></video> 代码却没显示？检查这三点
多数富文本编辑器（如 TinyMCE、CKEditor、WordPress 古腾堡）允许切换到“HTML 源码”模式后手动插入标签，但常见失效原因不是语法错，而是环境限制：
- 视频
src写的是相对路径（如"videos/demo.mp4"），但编辑器预览时未运行在 Web 服务下——必须通过http://localhost:5500类似地址访问，不能双击打开 HTML 文件 - 编辑器自动过滤了
<video></video>或<source></source>标签（尤其 CMS 后台），需在配置中启用allowedContent或关闭 XSS 过滤 - 路径用了中文或空格（如
"产品介绍 v1.mp4"），部分服务端或 CDN 会拒绝解析，换成"product-intro-v1.mp4"更稳妥
<source></source> 多格式写法和浏览器实际加载逻辑
只写一个 mp4 源看似够用，但 Firefox 在某些 Linux 环境、旧版 Safari 仍可能 fallback 失败。浏览器按 <source></source> 顺序尝试，**第一个 type 被识别且能解码的才加载**，不是“选兼容性最好的”：
<video controls width="100%"><source src="video/demo.mp4" type="video/mp4"><source src="video/demo.webm" type="video/webm"><p>您的浏览器不支持视频播放。</p> </source></source></video>
-
mp4必须是 H.264 编码 + AAC 音频，不是所有 .mp4 都能播（比如 ProRes 编码的 macOS 导出文件就不行） -
webm推荐用 VP9 编码，比 VP8 体积小 30%+，但老设备可能卡顿；可用ffmpeg -i in.mp4 -c:v libvpx-vp9 -crf 30 out.webm快速转 - 别加
ogg：现代浏览器基本不用它，反而增加 HTTP 请求和维护负担
移动端自动播放必须加 muted 和 playsinline
iOS Safari 和 Android Chrome 强制要求：带声音的 autoplay 必须由用户手势触发，否则静音也不播；而全屏强制跳转对编辑器嵌入场景很不友好：
- 加
muted是硬性前提：<video autoplay muted></video> - 加
playsinline阻止 iOS 自动全屏（否则视频一播就弹出原生播放器） - 如果还要“点击后才播”，用 JS 绑定
onclick="this.play()"，但注意 iOS 要求该事件在用户手势链内（不能 setTimeout 延迟调用）
真正麻烦的不是写几行 HTML，而是视频文件本身是否被浏览器解码器认得、路径是否经由 HTTP 协议可达、以及移动端策略是否被绕过——这些点漏掉一个，<video></video> 就只是段不可见的文本。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
