css进阶四（多媒体嵌入）

---

前言

       在网页设计中，多媒体技术主要是指在网页上运用音频视频传递信息的一种方式。在网络传输速度越来越快的今天，音频和视频技术已经被越来越广泛的应用在网页设计中，比起静态的图片和文字，音频和视频可以为用户提供更直观、丰富的信息。

---

一、视频音频嵌入技术概述

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

1、视频格式

包含视频编码、音频编码和容器格式。

常见视频格式：
（1）MPEG格式：英文全称为Moving Picture Experts Group，即运动图像专家组格式，家里常看的VCD、SVCD、DVD就是这种格式。MPEG文件格式是运动图像压缩算法的国际标准，它采用了有损压缩方法，从而减少运动图像中的冗余信息。MPEG的压缩方法说的更加深入一点就是保留相邻两幅画面绝大多数相同的部分，而把后续图像中和前面图像有冗余的部分去除，从而达到压缩的目的。目前MPEG主要压缩标准有MPEG-1、MPEG-2、MPEG-4、MPEG-7与MPEG-21。

(2) QGG格式：Ogg全称是OGG Vorbis， 是一种音频压缩格式，类似于MP3等的音乐格式。但有一点不同的是，它是完全免费、开放和没有专利限制的。OGG Vorbis有一个特点是支持多声道。Ogg Vorbis文件的扩展名是.OGG。这种文件的设计格式是非常先进的。创建的OGG文件可以在未来的任何播放器上播放，因此，这种文件格式可以不断地进行大小和音质的改良，而不影响旧有的编码器或播放器。

(3) WebM格式：WebM由Google提出，是一个开放、免费的媒体文件格式。WebM 影片格式其实是以 Matroska（即 MKV）容器格式为基础开发的新容器格式，里面包括了VP8影片轨和 Ogg Vorbis 音轨，其中Google将其拥有的VP8视频编码技术以类似BSD授权开源，Ogg Vorbis 本来就是开放格式。 WebM标准的网络视频更加偏向于开源并且是基于HTML5标准的，WebM 项目旨在为对每个人都开放的网络开发高质量、开放的视频格式，其重点是解决视频服务这一核心的网络用户体验。

2、音频格式

是指要在计算机内播放或是处理音频文件。

常见音频格式：
（1）QGG格式：Ogg全称是OGG Vorbis， 是一种音频压缩格式，类似于MP3等的音乐格式。但有一点不同的是，它是完全免费、开放和没有专利限制的。OGG Vorbis有一个特点是支持多声道。Ogg Vorbis文件的扩展名是.OGG。这种文件的设计格式是非常先进的。创建的OGG文件可以在未来的任何播放器上播放，因此，这种文件格式可以不断地进行大小和音质的改良，而不影响旧有的编码器或播放器。

（2）MP3格式：Mp3格式诞生于八十年代的德国，所谓的MP3也就是指的是MPEG标准中的音频部分，也就是MPEG音频层。根据压缩质量和编码处理的不同分为3层，分别对应 *.mp1 / *.mp2/ *.mp3 这3种声音文件。需要提醒大家注意的地方是：MPEG音频文件的压缩是一种有损压缩，MPEG3音频编码具有10：1~12：1的高压缩率，同时基本保持低音频部分不失真，但是牺牲了声音文件中12KHz到16KHz高音频这部分的质量来换取文件的尺寸，相同长度的音乐文件，用 *.mp3 格式来储存，一般只有 *.wav 文件的1/10，因而音质要次于CD格式或WAV格式的声音文件。

（3）WAV是最常见的声音文件格式之一，是微软公司专门为Windows开发的一种标准数字音频文件，该文件能记录各种单声道或立体声的声音信息，并能保证声音不失真。但WAV文件有一个致命的缺点，就是它所占用的磁盘空间太大（每分钟的音乐大约需要12兆磁盘空间）。它符合资源互换文件格式（RIFF）规范，用于保存Windows平台的音频信息资源，被Windows平台及其应用程序所广泛支持。Wave格式支持MSADPCM、CCITT A律、CCITT μ律和其他压缩算法，支持多种音频位数、采样频率和声道，是PC机上最为流行的声音文件格式；但其文件尺寸较大，多用于存储简短的声音片段。

二、在HTML5中嵌入视频

1、基本语法格式

代码如下：

<video src="视频文件路径" controls="controls"><