昨天的文章中想插入SSL介绍视频，刚开始不会用编辑器的。
网上找到的代码复制进编辑器也没产生变化。
只到后来安和Blog 告诉我如何在编辑器中使用html代码要加！！！我才知道。
为了以后更好的应用，我简单的学习了下 html video 播放视频的代码
下面是我的笔记内容以及一个实操视频。

本站采用的文章编辑器是传统WEB编辑器，支持web代码直接输入，下面是个演示

    !!！
    <videosrc="视频地址" controls="controls" width="100%" height="100%">您的浏览器不支持播放该视频！</video>
    !!！

基础指南：

表示你要播放test.mp4视频

     <videosrc="test.mp4"controls></video>

width和height设置视频窗口大小

    <videosrc="hangge.mp4"controlswidth="400"height="300"></video>

当值为100%的时候是自适应环境大小

进阶指南

设置视频自动下载

    <videosrc="test.mp4"controlspreload="none"></video>

设置controlspreload不同的属性值，可以告诉浏览器应该怎样加载一个媒体文件：
（1）auto：让浏览器自动下载整个文件。
（2）none：让浏览器不必预先下载文件。
（3）metadata：让浏览器先加载视频的前帧，生成预览图。

设置自动播放属性

    <videosrc="test.mp4"controlsautoplay></video>

（1）使用autoplay可以让浏览器加载完视频文件后立即播放。

    <videosrc="test.mp4"controlsautoplaymuted></video>

（2）自动播放后加上muted。这样自动播放时会静音。

    <videosrc="hangge.mp4"controlsloop></video>

（3）使用loop属性让视频播放结束时，再从头开始播放。

设置封面背景

    <videosrc="hangge.mp4"controlsposter="hangge.png"></video>

设置替换视频的图片（封面图片）通过poster属性可以设置

设置兼容性

现在大部分浏览器都能支持H.264格式的视频，但总有一些小众浏览器不支持。
需要通过后备措施保证更多设备都能看到视频

利用设置多种播放格式

不使用src属性，而是在其内部嵌套一组元素。
浏览器会选择播放第一个它所支持的文件。
可以添加WebM格式的视频提供对老式浏览器的支持。

    <video controls>
    
        <source src="hangge.mp4"type="video/mp4">    #第一种播放方式为H264
    
        <source src="hangge.webm"type="video/webm">  #第二种播放方式为webm
    
    </video>

添加Flash后备措施（推荐）

添加多种格式播放那个方法我个人不推荐大家去用，毕竟大家目前用的浏览器都比较高端。
使用Flash作为备用播放方案比较合适，Flash兼容IE8连

    <video controls>
    
        <source src="hangge.mp4"type="video/mp4">
    
        <source src="hangge.webm"type="video/webm">
    
       
            <object id="flowplayer" width="400" height="300"
    
            data="flowplayer-3.2.18.swf"
    
            type="application/x-shockwave-flash">
    
            <param name="movie"value="flowplayer-3.2.18.swf">
    
            <param name="flashvars"value='config={"clip":"hangge.mp4"}'>
    
        </object>
    
    </video>

优先使用Flash作为首选播放器

以前大多数网站都这么做是因为Flash普及率比较高，HTML5作为后备兼容，
但是时代在进步，新出的谷歌浏览器开始停用Flash支持，现在H5的发展比较快。

        <object id="flowplayer" width="400" height="300"
        
            data="flowplayer-3.2.18.swf"
        
            type="application/x-shockwave-flash">
        
            <paramname="movie"value="flowplayer-3.2.18.swf">
        
            <paramname="flashvars"value='config={"clip":"hangge.mp4"}'>
        
         
        
            <videocontrols>
        
                <sourcesrc="hangge.mp4"type="video/mp4">
        
                <sourcesrc="hangge.webm"type="video/webm">
        
            </video>
     </object>

以上就是我个人对 WEB 播放器代码的使用的学习笔记，还是挺符合我实际使用的。

[HTML]学习如何使用html代码在网页中播放视频