HTML5 视频
HTML5支持<video>标签。 HTML视频标签用于在网页上流式传输视频文件，例如电影剪辑，歌曲剪辑。
当前，HTML视频标签支持三种视频格式:
mp4
webM
ogg
让我们看一下定义哪个Web浏览器支持视频文件格式的表。
| 浏览器 |
mp4 |
webM |
ogg |
 |
是 |
否 |
否 |
 |
是 |
是 |
是 |
 |
是 |
是 |
是 |
 |
否 |
是 |
是 |
 |
是 |
否 |
否 |
注意: Android还支持mp4格式。
HTML视频标记示例
让我们看看使用HTML视频标记播放mp4文件的代码。
<video controls>
<source src="movie.mp4" type="video/mp4">
您的浏览器不支持html video标签。
</video>
让我们看一下使用HTML视频标签播放ogg文件的示例。
<video controls>
<source src="movie.ogg" type="video/ogg">
您的浏览器不支持html video标签。
</video>
支持浏览器
HTML视频标记的属性
让我们看一下HTML 5视频标记属性的列表。
| 属性 |
说明 |
| controls |
它定义了用播放/暂停按钮显示的视频控件。 |
| height |
它用于设置视频播放器的高度。 |
| width |
它用于设置视频播放器的宽度。 |
| poster |
它指定当不播放视频时在屏幕上显示的图像。 |
| autoplay |
它指定视频将在准备就绪后立即开始播放。 |
| loop |
它指定视频文件每次完成时都将重新开始。 |
| muted |
它用于使视频输出静音。 |
| preload |
它指定在页面加载时上传视频文件的作者视图。 |
| src |
它指定视频文件的源URL。 |
HTML视频标记属性示例
让我们看一下HTML中的视频标记示例，该示例使用高度，宽度，自动播放，控件和循环属性。
<video width="320" height="240" controls autoplay loop>
<source src="movie.mp4" type="video/mp4">
您的浏览器不支持html video标签。
</video>
HTML视频格式的MIME类型
下面提供了可用的MIME类型HTML视频标记。
| 视频格式 |
MIME类型 |
| mp4 |
video/mp4 |
| ogg |
video/ogg |
| webM |
video/webM |
