html5音频标签
2016-07-14 本文已影响97人
卿卿木子七
1. HTML <audio> 标签
* 注意只有Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <audio> 标签
一段简单的html5音频
<audio src="/test.wav">您的浏览器不支持audio标签</audio>
以上代码不会显示音频控制也不会播放音频
它需要一些其余的属性：
| 属性 | 值 | 描述 |
|---|---|---|
| s | s | s |
| autoplay | autoplay | 如果出现该属性，则音频在就绪后马上播放 |
| controls | controls | 如果出现该属性，则向用户显示控件，比如播放按钮 |
| loop | loop | 如果出现该属性，则每当音频结束时重新开始播放 |
| muted | muted | 规定视频输出应该被静音 |
| preload | preload | 如果出现该属性，则音频在页面加载时进行加载，并预备播放.如果使用 "autoplay"，则忽略该属性 |
| src | src | 要播放的音频的 URL |
程序举例：打开页面自动播放并且显示播放按钮
<audio src="/test.wav" autoplay="autoplay" controls="controls"> Your browser does not support the audio element. </audio>
2. HTML <audio> 标签注意事项
当前，audio 元素支持三种音频格式：
| IE 9 | Firefox 3.5 | Opera 10.5 | Chrome 3.0 | Safari 3.0 | |
|---|---|---|---|---|---|
| Ogg Vorbis | √ | √ | √ | ||
| MP3 | √ | √ | √ | ||
| Wav | √ | √ | √ |
上面的例子使用一个 Wav 文件，适用于Firefox、Opera 以及 Safari 浏览器。
要确保适用于 IE 9 浏览器，音频文件必须是 MP3 类型
audio 元素允许多个 source 元素。source 元素可以链接不同的音频文件。浏览器将使用第一个可识别的格式：
<audio controls="controls"> <source src="/test.ogg" type="audio/ogg"> <source src="/test.mp3" type="audio/mpeg"> Your browser does not support the audio tag. </audio>
