使用HTML5的video标签是网页播放视频最简单且兼容性好的方式，无需插件，通过controls属性显示控制条，source标签指定MP4和WebM等多格式视频以适配不同浏览器，结合autoplay、muted、loop等属性可自定义播放行为，确保现代浏览器下稳定高效运行。
在网页中播放视频，最简单且兼容性好的方式是使用 HTML5 的 video 标签。它无需依赖第三方插件（如 Flash），浏览器原生支持，使用起来非常方便。
基本语法结构
使用 video 标签只需几行代码即可实现视频播放：
<video controls>
<source src=”example.mp4″ type=”video/mp4″>
您的浏览器不支持 video 标签。
</video>
说明：
– controls 属性用于显示播放、暂停、音量等控制条。
– source 标签指定视频文件路径和类型，可添加多个以适配不同浏览器。
– 中间的文字是降级提示，当浏览器不支持时显示。
支持的常见视频格式
不同浏览器对视频编码的支持略有差异，常用格式包括：
- MP4 (H.264)：几乎所有现代浏览器都支持，推荐首选。
- WebM：开源格式，Chrome、Firefox 等支持良好。
- OGG：较少使用，主要用于 Firefox 和旧版浏览器。
建议提供 MP4 和 WebM 两种格式，确保最大兼容性：
<video controls>
<source src=”movie.mp4″ type=”video/mp4″>
<source src=”movie.webm” type=”video/webm”>
抱歉，您的浏览器不支持视频播放。
</video>
常用属性设置
通过添加属性可以控制视频行为：
- autoplay：自动播放（部分浏览器限制静音才能自动播放）。
- muted：静音播放，常与 autoplay 配合使用。
- loop：循环播放。
- preload：预加载策略，可选 “none”、”metadata” 或 “auto”。
- width / height：设置播放器尺寸。
例如实现静音自动播放：
<video width=”640″ height=”360″ muted autoplay loop>
<source src=”bg-video.mp4″ type=”video/mp4″>
</video>
备用方案与兼容性处理
虽然现代浏览器普遍支持 video 标签，但仍需考虑老旧环境。除了提供多格式源文件，还可嵌入 Flash 或提示用户升级浏览器。不过目前大多数场景下，HTML5 视频已足够可靠。
基本上就这些，合理使用 video 标签，就能在网页中快速实现稳定高效的视频播放功能。