html5的<video>标签原生支持三种主要视频格式：MP4、WebM 和 Ogg。选择合适的格式能确保视频在不同浏览器中顺利播放。

MP4（H.264 + AAC）—— 兼容性最强

MP4 是目前兼容性最好的格式，几乎所有现代浏览器都支持它。但要注意，并非所有 MP4 文件都能播放，必须使用特定编码：

• 视频编码：H.264（也称 AVC）
• 音频编码：AAC
• MIME 类型：video/mp4

苹果 safari、微软 edge 和 internet Explorer 都只支持这种组合。因此，提供一个 H.264/AAC 编码的 MP4 文件是保证基础播放的关键。

WebM（VP8/VP9 + Vorbis/Opus）—— 开源高效

WebM 是 google 推出的开放、免版税格式，在 chrome、firefox 和 Opera 中支持良好。它的优势在于高压缩率和高质量，尤其适合网络传输。

立即学习“前端免费学习笔记（深入）”；

• 视频编码：VP8 或 VP9
• 音频编码：Vorbis 或 Opus
• MIME 类型：video/webm

VP9 编码能在保持画质的同时显著减小文件体积，适合高清视频内容。不过 Safari 对 WebM 的支持较晚，旧版本不兼容。

海螺视频

海螺AI推出的AI视频生成工具，可以生成高质量的视频内容。

99

查看详情

Ogg（Theora + Vorbis）—— 开源老将

Ogg 是一种开源容器格式，常用于 Firefox 和一些早期 html5 浏览器环境。

• 视频编码：Theora
• 音频编码：Vorbis
• MIME 类型：video/ogg

虽然技术免费开放，但 Theora 的压缩效率不如 H.264 或 VP9，文件更大，清晰度也有限。目前使用场景较少，主要用于对开源要求严格的项目。

实际应用建议

为了覆盖尽可能多的用户，推荐在 <video> 标签中同时提供多种格式：

<video controls>   <source src="movie.webm" type="video/webm">   <source src="movie.mp4" type="video/mp4">   <source src="movie.ogg" type="video/ogg">   您的浏览器不支持视频标签。 </video>

浏览器会按顺序尝试加载它支持的第一个格式。MP4 应放在最后作为兜底方案，因为它的兼容性最广。基本上就这些，不复杂但容易忽略编码细节。