H5基础浏览器兼容性

Posted 今天付出是为明天回报

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了H5基础浏览器兼容性相关的知识,希望对你有一定的参考价值。

<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls="controls">
<source src="/i/movie.ogg" type="video/ogg">
<source src="/i/movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

</body>
</html>

========================

上面的例子使用一个 Ogg 文件,适用于Firefox、Opera 以及 Chrome 浏览器。

要确保适用于 Safari 浏览器,视频文件必须是 MPEG4 类型。

video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式:

======================================

Internet Explorer

Internet Explorer 8 不支持 video 元素。在 IE 9 中,将提供对使用 MPEG4 的 video 元素的支持。

=================================================

<video> 标签的属性

属性描述
autoplay autoplay 如果出现该属性,则视频在就绪后马上播放。
controls controls 如果出现该属性,则向用户显示控件,比如播放按钮。
height pixels 设置视频播放器的高度。
loop loop 如果出现该属性,则当媒介文件完成播放后再次开始播放。
preload preload

如果出现该属性,则视频在页面加载时进行加载,并预备播放。

如果使用 "autoplay",则忽略该属性。

src url 要播放的视频的 URL。
width pixels 设置视频播放器的宽度。

 

以上是关于H5基础浏览器兼容性的主要内容,如果未能解决你的问题,请参考以下文章

测试环境H5页面浏览器兼容性测试

h5专题应该兼容那些浏览器?

H5点击事件兼容各种APP浏览器

H5兼容性问题

h5调用摄像头拍照兼容性及原生实现拍照取景框

H5之audio标签放音兼容所有浏览器方法