HTML 视频

HTML<video>元素用于在网页上显示视频。

示例

HTML <video> 元素

要以 HTML 格式显示视频，请使用<video>元素：

示例

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

亲自试一试 »

怎么运行的

这个controls属性添加视频控件，例如播放、暂停和音量。

始终包含在内是一个好主意width和height属性。如果未设置高度和宽度，则视频加载时页面可能会闪烁。

这个<source>元素允许您指定浏览器可以选择的替代视频文件。浏览器将使用第一个识别的格式。

之间的文字<video>和</video>标签只会在不支持的浏览器中显示<video>元素。

HTML <视频> 自动播放

要自动开始视频，请使用autoplay属性：

示例

<video width="320" height="240" autoplay>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

亲自试一试 »

笔记：Chromium 浏览器在大多数情况下不允许自动播放。但是，始终允许静音自动播放。

添加muted后 autoplay让您的视频开始自动播放（但静音）：

示例

<video width="320" height="240" autoplay muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

亲自试一试 »

浏览器支持

表中的数字指定第一个完全支持的浏览器版本<video>元素。

Element
<video>	4.0	9.0	3.5	4.0	10.5

HTML 视频格式

支持三种视频格式：MP4、WebM 和 Ogg。浏览器对不同格式的支持是：

Browser	MP4	WebM	Ogg
Edge	YES	YES	YES
Chrome	YES	YES	YES
Firefox	YES	YES	YES
Safari	YES	YES	NO
Opera	YES	YES	YES

HTML 视频 - 媒体类型

File Format	Media Type
MP4	video/mp4
WebM	video/webm
Ogg	video/ogg

HTML 视频 - 方法、属性和事件

HTML DOM 定义了方法、属性和事件<video>元素。

这允许您加载、播放和暂停视频，以及设置持续时间和音量。

还有一些 DOM 事件可以在视频开始播放、暂停等时通知您。

示例：使用 JavaScript

视频由大巴克兔。

亲自试一试 »

要获得完整的 DOM 参考，请访问我们的HTML 音频/视频 DOM 参考。

HTML 视频标签

Tag	Description
<video>	Defines a video or movie
<source>	Defines multiple media resources for media elements, such as <video> and <audio>
<track>	Defines text tracks in media players