audio标签_html/css_WEB-ITnose
程序员文章站
2022-04-26 10:03:18
...
audio
HTML5中的新元素标签audio是被大家等待已久的,它有原生支持音频播放的功能,而不需要浏览器安装额外的扩展;目前支持audio元素的浏览器主要有Safari 4,Firefox 3.5和Chrome 3。
audio元素标签的一些常用属性:
src:音频文件路径。
autobuffer:设置是否在页面加载时自动缓冲音频。
autoplay:设置音频是否自动播放。
loop:设置音频是否要循环播放。
controls:设置是否显示播放控制面板。
可以看到这些属性和video元素标签的属性很类似。下面我们来看一个代码范例:
这段代码可以在Firefox 3.5和Chrome 3中正常工作,对于Safari 4来说要使用ogg格式的音频文件替换掉mp3文件。不过,鉴于W3C的HTML5定义规范并没有最终完成,这些格式限制也许在将来会有所变化。
根据定义规范,以下几种API方法是可以使用的:
play():播放音频
pause():暂停播放
canPlayType():命令浏览器判断当前音频文件是否可以被播放
buffered():设定文件需要缓冲部分的开始与结束时间点。
另外,我们可以使用source元素标签来配合audio;source用来指定多个音频文件,如果当前浏览器不支持第一个文件,那么audio会自动尝试播放下面一个source中指定的文件;我们还可以在它们后面加上目前常规的embed代码来加载Flash播放器,作为后备方案;范例如下:
HTML5学习笔记简明版(4):新元素之video,audio,meter,datalist,keygen,output
HTML audio 标签
那些年的 web audio
初探音频上下文与音频节点
推荐阅读
-
请大家帮我看一下我这段代码中的ul和a为什么不能显示在同一行中。_html/css_WEB-ITnose
-
新手问,像这样用div做好还是dl dt dd做好_html/css_WEB-ITnose
-
过渡_html/css_WEB-ITnose
-
jquery给HTML元素添加 事件_html/css_WEB-ITnose
-
如何优雅地使用Sublime Text3_html/css_WEB-ITnose
-
前端wap页面问题,跪求解答,_html/css_WEB-ITnose
-
chrome中不可见字符引发的float问题_html/css_WEB-ITnose
-
栅格布局的两种简单的实现方式_html/css_WEB-ITnose
-
css3实现的文本无法选中效果_html/css_WEB-ITnose
-
div+css布局时的浏览器兼容问题_html/css_WEB-ITnose