- 包含音频 - html5 图片和多媒体
版本:HTML5
HTML 元素用于在文档中表示音频内容。元素可以包含多个音频资源,这些音频资源可以使用 src 属性或者元素来进行描述;浏览器将会选择最合适的一个来使用。对于不支持元素的浏览器,元素也可以作为浏览器不识别的内容加入到文档中。
浏览器支持
IE 9+、Firefox、Opera、Chrome 和 Safari 都支持 标签。 | ||||
注释:IE 8 或更早版本的 IE 浏览器不支持 标签。 |
示例
src="someaudio.wav">您的浏览器不支持 audio 标签。
标签定义及使用说明
标签定义声音,比如音乐或其他音频流。
- 目前,
元素支持的3种文件格式:MP3、Wav、Ogg。
- 可以在
和
之间放置文本内容,这些文本信息将会被显示在那些不支持
标签的浏览器中。
使用上下文
Content categories | 流式内容元素,段落内容元素, embedded content. If it has acontrols attribute:交互内容元素 and 段落内容元素. |
---|---|
允许内容(Permitted content) | 如果元素包含src 属性:零个或多个 元素,其后紧跟不包含 或者 媒体元素的透明内容。或者:零个或多个 元素,其后紧跟零个或多个 元素,其后紧跟不包含 或者 媒体元素的透明内容。 |
标记省略(Tag omission) | 不允许,开始标签和结束标签都不能省略。 |
允许的父级元素(Permitted parents) | 任何接受嵌入内容的元素。 |
Permitted ARIA roles | application |
DOM 接口(DOM接口) | HTMLAudioElement |
属性
该元素包含全局属性。
autoplay
布尔属性;如果指定(默认值为"false"!);指定后,音频会马上自动开始播放,不会停下来等着数据载入结束。autobuffer
THML5中废弃
布尔属性;如果指定,音频将会自动开始加载。即使没有设置自动播放。直到媒体缓存满了或者全部音频文件加载完毕,即使是在首次进入时。该属性应该仅仅用在用户可能会选择播放的音频上;例如用户通过“播放音频”链接来到的一个页面。该属性已在Gecko 2.0(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)中移除,使用preload属性取而代之。
buffered
你可以通过该属性获取已缓冲的资源的时间段信息。该属性包含一个TimeRanges
对象。controls
如果设置了该属性,浏览器将提供一个包含声音,播放进度,播放暂停的控制面板,让用户可以控制音频的播放。loop
布尔属性;如果指定,将循环播放音频。mozCurrentSampleOffset
尚未标准化
在音频播放时,表示相对于音频开始处的偏移量的一个数值。muted
表示是否静音的布尔值。默认值为false,表示有声音。played
一个TimeRanges
对象,表示所有已播放的音频片段。preload
枚举属性,让开发者自行思考来示意浏览器使用何种加载方式以达到最好的用户体验。可以是以下属性之一:none
:示意用户可能不会播放该音频,或者服务器希望节省带宽;换句话说,该音频不会被缓存;metadata
:示意即使用户可能不会播放该音频,但获取元数据(例如音频长度)还是有必要的。auto
:示意用户可能会播放音频;换句话说,如果有必要,整个音频都将被加载,即使用户不期望使用。- 空字符串:等效于
auto
属性。
假如不设置,默认值就是浏览器定义的了(不同浏览器会选择自己的默认值),即使规范建议设置为
使用备注:metadata
.autoplay
属性优先于preload
假如用户想自动播放视频,那么很明显浏览器需要下载视频。同时设置autoplay
和preload
属性在规范里是允许的。- 规范没有强制浏览器去遵循该属性的值;这仅仅只是个提示。
src
嵌入的音频的URL。该URL应遵从HTTP access controls.这是一个可选属性;你可以在audio元素中使用元素来替代该属性指定嵌入的音频。
volume
音频播放的音量。值从0.0(无声)到 1.0(最大声).
时间偏移量目前是指定为float类型的值,表示偏移的秒数。
备注:HTML5 规范中,时间偏移量值的定义还没有完成,有可能会变更。
你也可以使用Gecko特有的更加强大的audio API特性在JavaScript 代码中直接生成和控制音频流。详情参见Introducing the audio API extension。
文件格式
目前,元素支持的3种文件格式:MP3、Wav、Ogg。
浏览器 | MP3 | Wav | Ogg |
---|---|---|---|
Internet Explorer | YES | NO | NO |
Chrome | YES | YES | YES |
Firefox | YES | YES | YES |
Safari | YES | YES | NO |
Opera | YES | YES | YES |
属性
属性 | 值 | 描述 |
---|---|---|
autoplay | true | false | 如果是 true,则音频在就绪后马上播放。 |
controls | true | false | 如果是 true,则向用户显示控件,比如播放按钮。 |
end | numeric value | 定义播放器在音频流中的何处停止播放。默认地,声音会播放到结尾。 |
loopend | numeric value | 定义在音频流中循环播放停止的位置,默认是 end 属性的值。 |
loopstart | numeric value | 定义在音频流中循环播放的开始位置。默认是 start 属性的值。 |
playcount | numeric value | 定义音频片断播放多少次。默认是 1。 |
src | url | 所播放音频的 url。 |
start | numeric value | 定义播放器在音频流中开始播放的位置。默认地,声音在开头进行播放。 |
HTML 4.01 与 HTML 5 之间的差异
标签是 HTML 5 的新标签。
全局属性
标签支持HTML 的全局属性。
事件属性
标签支持HTML 的事件属性。
实例
播放声音:
您的浏览器不支持 audio 元素。
例子
基本用法
your browser does not support the audio
element.
使用元素的
元素
your browser does not support the audio
element.
鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com
免责声明:我们致力于保护作者版权,注重分享,当前被刊用文章因无法核实真实出处,未能及时与作者取得联系,或有版权异议的,请联系管理员,我们会立即处理! 部分文章是来自自研大数据AI进行生成,内容摘自(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供学习参考,不准确地方联系删除处理!邮箱:344225443@qq.com)
图片声明:本站部分配图来自网络。本站只作为美观性配图使用,无任何非法侵犯第三方意图,一切解释权归图片著作权方,本站不承担任何责任。如有恶意碰瓷者,必当奉陪到底严惩不贷!
内容声明:本文中引用的各种信息及资料(包括但不限于文字、数据、图表及超链接等)均来源于该信息及资料的相关主体(包括但不限于公司、媒体、协会等机构)的官方网站或公开发表的信息。部分内容参考包括:(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供参考使用,不准确地方联系删除处理!本站为非盈利性质站点,本着为中国教育事业出一份力,发布内容不收取任何费用也不接任何广告!)