H5 video标签初体验

        HTML5 新增 标签替代了原来的flash，  可用于在HTML或者XHTML文档中嵌入媒体播放器，用于支持文档内的视频播放。同时   标签也可以用于播放音频内容，但是  标签播放音频上会更适合一些。

---

        一般，我们在使用video标签的时候需要提供多个视频源，这主要是由于各个浏览器对视频格式的兼容性不同，所以至少要提供两种以上视频格式，并提供一段文字说明在视频事件无法加载的时候进行解释。

<video controls>

    <source src="/media/cc0-videos/flower.webm"
            type="video/webm">

    <source src="/media/cc0-videos/flower.mp4"
            type="video/mp4">

    Sorry, your browser doesn't support embedded videos.
</video>

         video标签中还有很多属性需要进行了解：

1. controls   如果你没有指定 controls 属性，那么视频不会展示浏览器自带的控件，我们也可以自己 用js或者其他方式来创建自己的视频控件

2. autoplay  自动播放属性，如果设置了自动播放，则浏览器在加载完成后会自动播放视频。而谷歌浏览器默认禁止了这一属性，如果想要自动播放，需要同时加上muted禁音。

3. currentTime 读取currentTime会返回当前视频的播放点，为一个双精度浮点值，这个值既可以获取也可以设置 。

4. duration 读取会返回视频的时长

5. loop 设置循环播放

6. volume 视频的音量属性 值为0-1

7. preload  视频的预加载方案

         none: 提示浏览器该视频不需要缓存
         auto: 自动缓存
         metdata： 抓取元数据 预加载视频宽度、时长、第一帧的内容

8. playbackRate 视频播放速度

9. muted 视频是否禁用 ture、false

10. pasued  true/false 判断当前视频是否处于暂停状态

11. poster  一个海报帧的URL，用于在用户播放或者跳帧之前展示。

12 ended 判断当前视频是否播放结束