HTML5 Video(视频)+Audio(音频)

HTML5 Video(视频)

很多站点都会使用到视频. HTML5 提供了展示视频的标准。

Web站点上的视频

直到现在，仍然不存在一项旨在网页上显示视频的标准。
今天，大多数视频是通过插件（比如 Flash）来显示的。然而，并非所有浏览器都拥有同样的插件。
HTML5 规定了一种通过 video 元素来包含视频的标准方法。

浏览器支持

Internet Explorer	Firefox	Opera	Google Chrome	Safari

Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 支持

---

HTML5 (视频)- 如何工作

如需在 HTML5 中显示视频，您所有需要的是：

实例

尝试一下 »

---

视频格式与浏览器的支持

当前，

浏览器	MP4	WebM	Ogg
Internet Explorer	YES	NO	NO
Chrome	YES	YES	YES
Firefox	YES	YES	YES
Safari	YES	NO	NO
Opera	YES (从 Opera 25 起)	YES	YES

• MP4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
• WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
• Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件

---

视频格式

格式	MIME-type
MP4	video/mp4
WebM	video/webm
Ogg	video/ogg

---

HTML5

HTML5

实例 1

为视频创建简单的 播放 / 暂停 以及 调整尺寸 控件：

上面的例子调用了两个方法：play() 和 pause()。它同时使用了两个属性：paused 和 width。
尝试一下 »
更多参考请查看 HTML5 Audio/Video DOM 参考手册.

---

HTML5 Video 标签

标签	描述
	定义一个视频
	定义多种媒体资源,比如
	定义在媒体播放器文本轨迹

---

---

HTML5 Audio(音频)

HTML5 提供了播放音频文件的标准。

互联网上的音频

直到现在，仍然不存在一项旨在网页上播放音频的标准。
今天，大多数音频是通过插件（比如 Flash）来播放的。然而，并非所有浏览器都拥有同样的插件。
HTML5 规定了在网页上嵌入音频元素的标准，即使用

浏览器支持

Internet Explorer	Firefox	Opera	Google Chrome	Safari

Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 都支持

---

HTML5 Audio - 如何工作

如需在 HTML5 中播放音频，你需要使用以下代码：

实例

尝试一下 »

control 属性供添加播放、暂停和音量控件。
在 之间你需要插入浏览器不支持的

---

音频格式及浏览器支持

目前,

浏览器	MP3	Wav	Ogg
Internet Explorer 9+	YES	NO	NO
Chrome 6+	YES	YES	YES
Firefox 3.6+	YES	YES	YES
Safari 5+	YES	YES	NO
Opera 10+	YES	YES	YES

---

音频格式的MIME类型

Format	MIME-type
MP3	audio/mpeg
Ogg	audio/ogg
Wav	audio/wav

---

HTML5 Audio 标签

标签	描述
	定义了声音内容
	规定了多媒体资源, 可以是多个，在