HTML <audio> Tag
Example
<audio controls>
<source src="cat.mp3" type="audio/mpeg">
<source src="cat.ogg" type="audio/ogg">
Your browser does not support the audio tag.
</audio>Meaning
The <audio> element includes audio in a document.
This <audio> element contains one or more <source> elements with different audio format's. The browser will choose the source it supports.
Tips and Notes:
- Alternate content should be placed inside of the audio element for browsers that do not support it.
- Having the correct MIME types on hosted media files is key for playback.
Version: HTML5
Audio format Support
| Browsers | Chrome | Chrome Android | Edge | Firefox | Firefox Android | IE | Opera | Opera Android | Safari | Safari IOS | Samsung Internet Android | Webview Android |
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| MP3 | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
| WAV | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
| OGG | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | No | Yes | Yes |
Standard Syntax
<audio controls autoplay loop preload | muted>
<source src="Source(URL)" type="mediaType">
Your browser does not support the audio tag.
</audio>Browser Support
Status
Attributes
| Attribute | Value | Description |
|---|---|---|
| autoplay | autoplay | This attribute indicates the browser should playing the audio as soon as after page load once it has loaded enough of the audio to avoid buffering. |
| autobuffer | Boolean | This Boolean attribute indicates whether or not the browser should begin buffering audio right away. |
| controls | controls | This attribute is specifies whether or not the browser should present the controls for audio, such as playback, pause, volume, and seeking. |
| controlslist | nodownload nofullscreen noremoteplayback |
Specifies the controls to show for the audio element. |
| disableremoteplayback | disableremoteplayback | Used to disable the capability of remote playback in devices that are attached using wired (HDMI, DVI, etc.) and wireless technologies (Miracast, Chromecast, DLNA, AirPlay, etc). |
| loop | loop | This Boolean attribute, if present, indicates that the audio should loop. |
| muted | muted | This Boolean attribute is set to the URL of the audio to show. |
| preload | auto metadata none |
This attribute specifies what the author thinks the audio should be loaded when the page loads |
| src | URL | This attribute is set to the URL of the audio to show. |
Global Attributes
<audio> element also supports the Global Attributes in HTML.
Event Attributes
<audio> element also supports the Event Attributes in HTML.
By Default CSS Value(s)
None