CSS+HTML<视频播放video标签的使用>

source是为了兼容各个浏览器。因为浏览器对视频格式支持不统一，有些浏览器例如有些浏览器支持 mp4格式 ，那么它就播放第一个 mp4 格式的视频，如果它不支持就检查是不是支持下面的 ogg 视频，如果支持就播放，不支持的话继续向下，下面没有source了，那么就显示“Your browser does not support the video tag.”

注意:

如果你在 <video>内设置了 muted 属性，是可以通过 autoplay 实现视频的自动播放，反之则需要用户手动授权，点击播放才可以实现自动播放。

因为谷歌浏览器禁止页面在没有用户授权的情况下进行有声的视频播放

当前 <video> 元素支持三种视频格式： 尽量使用 mp4格式

使用语法

支持格式

常用属性

当前 <audio> 元素支持三种视频格式： 尽量使用 mp3格式

使用语法

支持格式

div+css布局如何插入视频的方法。

如下参考：

1.创建一个新的HTML文件test.html来解释div+CSS布局的基本过程。

2.在test.html文件中，设置正文的样式，将margin设置为0,padding设置为0，将text对齐到文本的中心。

3.在test.html文件中，为了便于解释，将所有div的高度设置为200px，内容的颜色设置为红色。

4.在test.html文件中，使用div创建页面的标题，使用margin:0auto设置divcenter，将其宽度设置为800px，背景颜色设置为灰色。

5.在test.html文件中，使用div创建页面的中间部分，使用margin:0auto设置divcenter，并将其宽度设置为800px。

6.在test.html文件中，在页面的中间创建两个div，将中间分成两个部分，每个部分的宽度为50%。左边部分使用float:left来设置左边的float，右边部分使用float:right来设置右边的float。

7.在test.html文件中，使用div创建页面的底部。使用clear:两者都清除上面div的浮动，以避免影响底部的布局。同时，使用margin:0auto来设置divcenter，宽度为800px，背景颜色为#000fff。

8.在浏览器中打开test.html文件，布局插入视频的问题就解决了。

---