HTML标签 <audio> 用于在网页上嵌入音频内容。它允许您在网页上播放音频文件,而无需使用第三方插件。
属性
- autoplay: 如果设置为true,则音频会在加载完成后自动播放。
- controls: 如果设置为true,则会显示播放/暂停按钮以及音量控制。
- loop: 如果设置为true,则音频会循环播放。
- muted: 如果设置为true,则音频会被静音。
- preload: 指示浏览器在页面加载时是否应该加载音频。可选值有"none"、"metadata"和"auto"。
- src: 指定音频文件的URL。
示例代码
<audio controls> <source src="audio.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>
在这个示例中,我们使用了<audio>标签来嵌入一个音频文件,并设置了controls属性以显示播放控件。如果浏览器不支持<audio>标签,将显示"Your browser does not support the audio element."。
支持的文件格式
<audio>标签支持多种音频文件格式,包括:
- MP3: audio/mpeg
- Ogg: audio/ogg
- WAV: audio/wav
- WebM: audio/webm
事件
<audio>标签还支持一些事件,如:
- onplay: 在音频播放时触发。
- onpause: 在音频暂停时触发。
- onended: 在音频播放结束时触发。
注意事项
- 在使用
<audio>标签时,请确保您拥有音频文件的版权或已获得授权使用。 - 不同浏览器对音频格式的支持有所不同,请根据您的目标受众选择合适的音频格式。
| 浏览器 | 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 | autoplay | 如果出现该属性,则音频在就绪后马上播放。 |
| controls | controls | 如果出现该属性,则向用户显示音频控件(比如播放/暂停按钮)。 |
| loop | loop | 如果出现该属性,则每当音频结束时重新开始播放。 |
| muted | muted | 如果出现该属性,则音频输出为静音。 |
| preload | auto metadata none | 规定当网页加载时,音频是否默认被加载以及如何被加载。 |
| src | URL | 规定音频文件的 URL。 |