<video>标签为html5新增标签。在广东互联网协会官网项目中，首页引入了一次此标签，使用了preload属性以及webkit-playsinline属性。首次使用<video>实践真实项目，所以我想根据w3school上对该标签的描述，对其进行一次使用方法的总结。
使用video标签
- <video>标签（<audio>与之基本相同）
基本用法：
<video src="movie.mp4" controls="controls">
您的浏览器不支持 video 标签。出不支持该标签的信息。
</video>
可以在开始标签和结束标签之间放置文本内容，这样老的浏览器就可以显示出不支持该标签的信息。
兼容问题：Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <video> 标签。
属性：
1、autoplay： 自动播放，如果出现该属性，则视频/音频在就绪后马上播放。
2、preload： 预加载，如果出现该属性，则视频/音频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。
3、controls： 显示播放控件，如果出现该属性，则向用户显示视频/音频控件，比如播放按钮。
4、loop： 视频/音频循环播放
5、poster： 值为一个url，规定视频下载时显示的图像，或者在用户点击播放按钮前显示的图像。
6、muted：静音
7、src：要播放的视频/音频的 URL。
8、width与height： 设置视频播放器的宽高。
2、<source>标签
<source> 标签用于规定可替换的视频/音频文件，供浏览器根据它对媒体类型或者编解码器的支持进行选择。
例如：
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持audio标签
</audio>
3、ios端不自动全屏播放
<video src="1.mp4" webkit-playsinline playsinline x5-playsinline x-webkit-airplay="allow"></video>
网友评论