html5播放器的标签与用法(mp4视频编码问题)
2017-06-23 11:45
357 查看
html5播放器范例
先来个范例吧,html5的播放器代码,就是这么简单:
Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件
MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
这不太好吧?大哥。
NO,最佳的解决方法是,只用mp4标准h264视频文件格式。
看不明白以上的含义?,不要紧,直接参考如下格式转换的参数设定吧。
MP4属高清格式,MP4格式要求如下:
视频编码:h264、 音频编码:AAC
事情就是这样了。
先来个范例吧,html5的播放器代码,就是这么简单:
<video width="320" height="240" controls="controls"> <source src="movie.ogg" type="video/ogg"> <source src="movie.mp4" type="video/mp4"> Your browser does not support the video tag. </video>
html5对视频格式的要求
当前,video 元素支持三种视频格式:格式 | IE | Firefox | Opera | Chrome | Safari |
---|---|---|---|---|---|
Ogg | No | 3.5+ | 10.5+ | 5.0+ | No |
MPEG 4 | 9.0+ | No | No | 5.0+ | 3.0+ |
WebM | No | 4.0+ | 10.6+ | 6.0+ | No |
MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
WHAT?
一个视频一定要放三个视频文件吗?那不是很占服务器空间资源?这不太好吧?大哥。
NO,最佳的解决方法是,只用mp4标准h264视频文件格式。
什么是mp4标准h264文件格式
酷播官方有一个关视频格式h264格式的,表格,参考如下:格式 | 容器 | |
---|---|---|
视频编码 | H.264 | MPEG-4:MP4、M4V、F4V、3GPP |
视频编码 | Sorenson Spark | FLV 文件 |
音频编码 | AAC+ / HE-AAC / AAC v1 / AAC v2 | MPEG-4:MP4、M4V、F4V、3GPP |
音频编码 | Nellymoser | FLV 文件 |
音频编码 | Speex | FLV 文件 |
MP4属高清格式,MP4格式要求如下:
视频编码:h264、 音频编码:AAC
事情就是这样了。
相关文章推荐
- 验证是否支持html5的Video标签及MP4视频播放
- html5 video标签不能播放mp4的问题
- 解决chromium对html5 标签的 mp3 等视频音频网页的兼容性问题
- 解决HTML5的Video标签,有部分MP4无法播放的问题
- html5视频标签播放视频时的事件问题
- html5基础标签(html5视频标签 html5新标签用法)
- html5-video视频标签播放视频实现过程中遇到的一系列问题。
- html5的video标签插入mp4视频放在iis服务器访问无法播放解决方案
- 验证是否支持html5的Video标签及MP4视频播放
- 解决chromium对html5 标签的 mp3 等视频音频网页的兼容性问题
- HTML5的video标签,视频在网页播放没有画面只有声音,支持的格式,MP4,
- 【译】解决HTML5 MP4(H.264)视频模糊的问题
- Chrome、firefox浏览器中video标签无法播放MP4视频问题
- Html5 video 标签中视频有声音没画面问题解决过程
- Android HTML5 Video视频标签自动播放与自动全屏问题解决
- 【转】Android HTML5 Video视频标签自动播放与自动全屏问题解决
- Android HTML5 Video视频标签自动播放与自动全屏问题解决
- 验证是否支持html5的Video标签及MP4视频播放
- HTML5 Video标签播放MP4失败的问题
- 验证是否支持html5的Video标签及MP4视频播放