Web前端技术项目式教程课件 任务六 多媒体嵌入.pptxVIP

Web前端技术项目式教程

（HTML5+CSS3+Flex+Bootstrap）

任务六

多媒体嵌入

知识目标1了解HTML5支持的音频和视频格式。2熟悉HTML5中音频和视频相关属性。

能力目标1掌握使用HTML5多媒体元素在网页中播放音频和视频。

素质目标1培养学生具备正确的网络伦理和社会责任感。2培养学生遵守行业标准（如W3C规范）的习惯。

思维导图

任务描述李明考虑到网站目前只有文字和图像两种形式的内容，想通过增加多媒体元素丰富网站内容。本任务的具体要求如下。制作“传统节日”页面。在“传统节日”页面中嵌入音频和视频。

知识引入1．音频文件格式2．音频文件嵌入3．视频文件格式4．视频文件嵌入

1．音频文件格式在HTML5中嵌入的音频格式主要包括MP3、Wav、Ogg。具体介绍如下：MP3：一个有损数据压缩格式，它的优点是：文件容量小、方便存储/播放。但音质一般。Wav：也称为波形文件，能记录各种单声道或立体声的声音信息，并能保证声音不失真这是它的独特亮点；但同时它有一个非常大的缺点，就是文件占用的内存空间很大。Ogg：同样是一个音频压缩格式，相比于MP3，OGG格式可以提供更好的音质。

2．音频文件嵌入在HTML5中，audio标签用于嵌入音频文件。bodyaudiocontrolssourcesrc=chun.wavtype=