知向前端
亲测 video 标签 视频格式的兼容现状
2020-1-23 Jon

html5 video标签再熟悉不过了


Iternet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <video> 标签。
注释:Internet Explorer 8 以及更早的版本不支持 <video> 标签。

src所支持的视频格式有三种



mp4、ogg、webm



之前看到的说法是











































  格式 IE Firefox Opera Chrome Safari
  MPEG4 9.0+ No No 5.0+ 3.0+
  Ogg No 3.5+ 10.5+ 5.0+ No
  WebM No 4.0+ 10.6+ 6.0+ No

经过测试得到的结论是




















































  格式 IE Firefox Opera Chrome Safari
  测试版本号 11 73.0 65.0 80.0 12.0.3
  MPEG4 YES YES YES YES YES
  Ogg NO YES YES YES NO
  WebM NO YES YES YES NO

结论



随着浏览器的版本迭代,MP4可以通用了,再也不需要一个视频弄好几个格式了。



附上测试代码


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>视频格式兼容测试</title>
<style>
video { width: 200px;}
</style>
</head>
<body>
<video src="https://gitee.com/yinuocode/blogsImg/raw/master/video/ceshi.mp4" controls></video>
<video src="https://gitee.com/yinuocode/blogsImg/raw/master/video/ceshi.ogg" controls></video>
<video src="https://gitee.com/yinuocode/blogsImg/raw/master/video/ceshi.webm" controls></video>
</body>
</html>




 




html5 video标签再熟悉不过了 Iternet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <video> 标签。 注释:Internet Explorer 8 以及更早的版本不支持 <video> 标签。 src所支持的视频格式有三种 mp4、ogg、webm


[Html5 video biāoqiān zài shúxī bùguòle Iternet Explorer 9+, Firefox, Opera, Chrome yǐjí Safari zhīchí <video> biāoqiān. Zhùshì:Internet Explorer 8 yǐjí gèng zǎo de bǎnběn bù zhīchí <video> biāoqiān. Src suǒ zhīchí de shìpín géshì yǒusān zhǒng mp4,ogg,webm]




html5 video tag too familiar
Iternet Explorer 9+, Firefox, Opera, Chrome and Safari support <video> tag.
Notes: Internet Explorer 8 and earlier versions do not support the <video> tag.
src supported video formats, there are three
mp4, ogg, webm





评论:
Jon
2020-03-30 17:47 回复
@Vincent:是的
Vincent
2020-03-30 17:46 回复
Opera、Edge 都使用chrome内核了
发表评论:
昵称

邮件地址 (选填)

个人主页 (选填)

内容