🌊🌈关于前言：

文章部分内容及图片出自网络，如有问题请与我本人联系(主页介绍中有公众号)

本博客暂适用于刚刚接触HTML以及好久不看想要复习的小伙伴

🌊🌈关于内容：

8.1 HTML5 多媒体的特性

在 HTML5 出现之前并没有将视频和音频嵌入到页面的标准方式，多媒体内容在大多数情况下都是通过第三方插件或集成在 Web 浏览器的应用程序置于页面中。

例如，目前最流行的方法是通过 Adobe 的 FlashPlayer 插件将视频和音频嵌入到网页中。

通过这样的方式实现的音视频功能，不仅需要借助第三方插件而且实现代码复杂冗长，运用 HTML5 中新增的 video 标签和 audio 标签可以避免这样的问题。在 HTML5 语法中，video 标签用于为页面添加视频，audio 标签用于为页面添加音频，这样用户就可以不用下载第三方插件，直接观看网页中的多媒体内容。

8.2 多媒体的支持条件

虽然 HTML5 提供的音视频嵌入方式简单易用，但在实际操作中却要考虑视频音频编解码器、浏览器等众多因素。

8.2.1 视频和音频编解码器

由于视频和音频的原始数据一般都比较大，如果不对其进行编码就放到互联网上，传播时会消耗大量时间，无法实现流畅的传输或播放。这时通过视频和音频编解码器对视频和音频文件进行压缩，就可以实现视频和音频的正常传输和播放。

1.视频编解码器

视频编解码器定义了多媒体数据流编码和解码的算法。其中编码器主要是对数据流进行编码操作，用于存储和传输。解码器主要是对视频文件进行解码，例如使用视频播放器观看视频，就需要先进行解码，然后再播放视频。目前，使用最多的 HTML5 视频解码文件是H.264、Theora 和 VP8，对它们的具体介绍如下：

H.264
_
H.264 是国际标准化组织( ISO )和国际电信联盟( ITU )共同提出的继 MPEG4 之后的新一代数字视频压缩格式，是 ITU-T 以 H.26x 系列为名称命名的视频编解码技术标准之一。
Theora
_
Theora 是免费开放的视频压缩编码技术，可以支持从 VP3 HD 高清到 MPEG-4/DiVX 视频格式。
VP8
_
VP8 是第八代的 On2 视频，能以更少的数据提供更高质量的视频，而且只需较小的处理能力即可播放视频。

2.音频编解码器

音频编解码器定义了音频数据流编码和解码的算法。与视频编解码器的工作原理一样，音频编码器主要用于对数据流进行编码操作，解码器主要用于对音频文件进行解码。目前，使用最多的 HTML5 音频解码文件是 AAC、MP3 和 Ogg，对它们的具体介绍如下。

AAC
_
AAC 是高级音频编码 ( Advanced Audio Coding ) 的简称，该音频编码是基于 MPEG-2 的音频编码技术。目的是取代 MP3 格式。2000年 MPEG-4 标准出现后，AAC 重新集成了其特性，加入了 SBR 技术和 PS 技术。
MP3
_
MP3是 “ MPEG-1 音频层 3” 的简称。它被设计用来大幅度地降低音须数据量。利用该技术，可以将音乐以 1 : 10 甚至 1 : 12 的压缩率压缩成容量较小的文件。而音质并不会明显地下降。
Ogg
_
Ogg 全称为 Ogg Vorbis, 是一种新的音频压缩格式，类似于 MP3 等现有的音乐格式。OGG Vorbis 有一个很出众的特点，就是支持多声道。

8.2.2 多媒体的格式

运用 HTML5 的 video 和 audio 标签可以在页面中嵌入视频或音频文件，如果想要这些文件在页面中加载播放，还需要设置正确的多媒体格式，下面具体介绍 HTML5 中视频和音频的一些常见格式。

1.视频格式

视频格式包含视频编码、音频编码和容器格式。在 HTML5 中嵌入的视频格式主要包括Ogg、MPEG4、WebM 等，具体介绍如下：

Ogg: 指带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件。
MPEG4: 指带有H.264视频编码和 AAC 音频编码的 MPEG4 文件。
WebM: 指带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件。

2.音频格式

音频格式是指要在计算机内播放或是处理音频文件。在 HTML5 中嵌入的音频格式主要包括 Vorbis、MP3、Wav 等，具体介绍如下：

Vorbis: 是类似 AAC 的另一种免费、开源的音频编码，是用于替代 MP3 的下一代音频压缩技术。
MP3: 是一种音频压缩技术，其全称是动态影像专家压缩标准音频层面3 ( MovingPicture Experts Group Audio Layer III)，简称为 MP3。它被设计用来大幅度地降低音频数据量。
Wav: 是录音时用的标准的 Windows 文件格式，文件的扩展名为 “WAV" ，数据本身的格式为 PCM 或压缩型，属于无损音乐格式的一种。

8.2.3 支持视频和音频的浏览器

到目前为止，很多浏览器已经实现了对 HTML5 中 video 和 audio 元素的支持。

浏览器对 video 和 audio 的支持情况

浏览器	支持版本
IE	9.0 及以上版本
Firefox	3.5 及以上版本
Opear	10.5 及以上版本
Chrome	3.0 及以上版本
Safari	3.2 及以上版本

上述表中列举了各主流浏览器对 video 和 audio 元素的支持情况。但在不同的浏览器上显示视频的效果也略有不同。在不同的浏览器中，相同的视频其播放控件的显示样式却不同。这是因为每一个浏览器对内置视频控件样式的定义不同，这也就导致了在不同浏览器中会显示不同的控件样式。

今日入门学习暂时告一段落

Peace

🌊🌈往期回顾：

🌊🌈关于后记：

感谢阅读，希望能对你有所帮助博文若有瑕疵请在评论区留言或在主页个人介绍中添加联系方式私聊我感谢每一位小伙伴不吝赐教

原创不易，「点赞」+「评论」 谢谢支持❤

阿ken的HTML、CSS的入门指南（十六）_多媒体技术