一、HTML5媒体元素

1、了解媒体元素在网页上的使用场景

2、掌握媒体元素的使用方法

本次课将会学习到两个媒体元素：视频和音频。

在现实中，如何实现在网页上播放视频和音频？

<video src="视频路径" controls></video>

src是指定要八方的视频文件的路径；controls是提供播放、暂停和音量的控件。

这里引入了一个浏览器支持与否的问题：

那如果你的浏览器不支持你的视频格式呢？

source标签的作用是给视频资源设置几个格式，这样浏览器可以选择自己可以播放的格式进行播放。

自动播放标签，加上这个标签之后不需要去按播放键就能自动播放。

<audio src="音频路径" controls></audeo>

H5又叫互动H5，相当于微信上的PPT，主要时用于品牌方传播和推广的载体。

H5是指：在智能手机可以播放Flash的移动端上呈现的，可以达到Flash效果（如各种动画，互动）的，用于广告、营销的，具有酷炫效果的网页。

H5从2014年底的初露锋芒到2015年的全面火爆，再到2016的沉淀，2017年，H5依然是品牌社会化传播的首选。H5通俗点就是一种编程语言，H5很早以前就存在，由于微信迅速的崛起，H5语言编写的界面和微信浏览器比较兼容，故此H5借助微信也越来越红火。

扩展资料：

HTML5的canvas元素可以实现画布功能，该元素通过自带的API结合使用JavaScript脚本语言在网页上绘制图形和处理，拥有实现绘制线条、弧线以及矩形，用样式和颜色填充区域，书写样式化文本，以及添加图像的方法，且使用JavaScript可以控制其每一个像素。

HTML5最大特色之一就是支持音频视频，在通过增加了<audio>、<video>两个标签来实现对多媒体中的音频、视频使用的支持，只要在Web网页中嵌入这两个标签，而无需第三方插件（如Flash）就可以实现音视频的播放功能。

---