重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
这篇“HTML5新增的多媒体标签怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“HTML5新增的多媒体标签怎么使用”文章吧。
创新互联公司提供成都网站设计、做网站、网页设计,品牌网站建设,1元广告等致力于企业网站建设与公司网站制作,10年的网站开发和建站经验,助力企业信息化建设,成功案例突破数千家,是您实现网站建设的好选择.
HTML5新增的多媒体标签
一:视频
当前
浏览器 | MP4 | WebM | Ogg |
---|---|---|---|
IE | YES | NO | NO |
Chrome | YES | YES | YES |
Firefox | YES 从Firefox21版本开始Linux系统从Firefox 30开始 | YES | YES |
Safari | YES | NO | NO |
Opera | YES 从Opera25版本开始 | YES | YES |
视频
属性 | 值 | 描述 |
---|---|---|
autoplay | autoplay | 视频就绪自动播放(谷歌浏览器需添加muted来解决自动播放问题) |
controls | controls | 向用户显示播放控件 |
width | pixels(像素) | 设置播放器宽度 |
height | pixels(像素) | 播放器高度 |
loop | loop | 循环播放 |
src | url | 视频url地址 |
poster | imageurl | 加载等待的话面图片 |
muted | muted | 静音播放 |
二:音频
浏览器 | MP3 | Wav | Ogg |
---|---|---|---|
IE 9+ | YES | NO | NO |
Chrome 6+ | YES | YES | YES |
Firefox 3.6+ | YES | YES | YES |
Safari 5+ | YES | YES | NO |
Opera 10+ | YES | YES | YES |
HTML5音频标签
谷歌浏览器把音频和视频自动播放禁止了
属性 | 值 | 描述 |
---|---|---|
autoplay | autoplay | 自动播放 |
controls | controls | 向用户显示播放控件 |
loop | loop | 循环播放 |
src | url | 视频url地址 |
muted | muted | 静音播放 |
多媒体标签总结
音频标签和视频标签使用方式基本一致
浏览器支持情况不同
谷歌浏览器把音频和视频自动播放禁止了
我们可以给视频标签加muted属性来静音播放视频,音频不可以(可以通过JavaScript来解决)
视频标签是重点,我们经常设置自动播放,不适用conrols控件,循环和设置大小属性
以上就是关于“HTML5新增的多媒体标签怎么使用”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注创新互联行业资讯频道。