HTML部分

[HTML5音视频]

这里只介绍HTML5在音视频部分新添加的标签的基本用法。

视频

video标签

基本信息

video标签是HTML5新添加的标签，用来放视频文件，其中可以支持的文件格式包括mp4、webm、ogv

作为标签，video内部可添加文字，这些文字只有在不支持video标签/不支持视频格式的时候显示

浏览器支持

各大主流浏览器中，Firefox和Chrome支持以上三种文件格式的视频，只是控制菜单有些不同

safari只认mp4

IE8及以下不支持video标签，以上的只认mp4

常用属性

src：视频的路径，最重要的属性，必需

controls：视频播放的控制台，如果缺失只有视频的第一帧，必需

width/height：视频的长宽，必须是按照源文件的大小等比例缩放，如果同时设置，只会让播放器宽高拉伸，而视频内容始终在中心

autoplay：设置视频是否自动播放，Chrome下必需点击播放的按钮才可播放

loop：设置视频是否在播放结束后自动从头重新播放

poster：视频刚加载未播放时显示的图片，也是设置一个图片，否则停在视频第一帧，中途暂停或者倒回到开头无效

muted：设置视频播放是否为静音，这个属性同autoplay同时存在时，可以解决Chrome无法自动播放的bug

source标签

source标签可定义在video内部，可添加src属性，同样也表示视频文件的路径，但video里的src属性优先度高于source的

如果第一个标签的视频播放失败，继续看下一个source标签的视频是否可以正常播放，直至最后一个