LAST UPDATED: MARCH 18, 2021
HTML audio Tag
The HTML <audio> tag is used to add any audio file to a webpage. HTML helps you to add multimedia files on your website by providing various multimedia tags/elements like <audio>, <video>, <embed> and <object>.
-
The <audio> tag is used to embed audio content in an HTML document without requiring any additional plug-in like the Flash player.
-
The <audio> tag is used to display the audio files on the Web Page, which can be played by the user in the browser itself.
-
The src attribute in the <audio> tag is used to specify the URL for the multimedia file.
There are three file formats that are supported by the <audio> tag with their MIME type and these are given below:
| File Format |
MIME_TYPE |
| .MP3 |
audio/mp3 |
| .WAV(wave audio file format) |
audio/wav |
| .OGG |
audio/ogg |
There may be one or more audio sources in an <audio> element which can be represented using src attribute or <source> element and the browser will choose the most suitable one out of the mentioned sources.
HTML <audio> Tag- Syntax and Usage
The <audio> tag requires both opening (start) tag and closing(end) tag.
Required syntax for the same is given below:
<audio>
...
</audio>
Note: Those browsers that do not support the <audio> tag will display the text inside the <audio> tag.
HTML <audio> Tag Attributes
HTML <audio> tag supports Global attributes and Event attributes, along with some other attributes that are given below:
| Attribute |
Description |
autoplay |
plays the audio file as soon as the webpage loads. |
controls |
displays the controls on the webpage, such as play and pause buttons. |
loop |
replays the audio file |
preload |
specifies whether the audio file is preloaded on the webpage or not. |
src |
provides the location of the audio file to play. |
HTML <audio> Tag Basic Example
Below we have a basic example for a clear understanding of the <audio> tag:
In the above example, we have used an audio tag to embed an audio file to the webpage. When you will run the above code in the browser the audio gets automatically started. This audio file is played only once, also we have included the controls attribute to show the controls for playing and pausing the audio. To play audio files multiple times you can use the loop attribute.
Using the <source> Tag
We can use the source tag to provide the source URL of the audio file,
<audio controls>
<source src="myAudio.mp3" type="audio/mpeg">
<p>Your browser doesn't support HTML5 audio. Here is
a <a href="myAudio.mp4">link to the audio</a> instead.</p>
</audio>
We can also use multiple source tags to provide multiple audio files URL in the audio tag:
<audio controls>
<source src="myAudio.mp3" type="audio/mpeg">
<source src="myAudio.ogg" type="audio/ogg">
<p>Your browser doesn't support HTML5 audio. Here is
a <a href="myAudio.mp4">link to the audio</a> instead.</p>
</audio>
Browser Support for HTML <audio> Tag
-
Firefox 3.5+
-
Google Chrome 4+
-
Internet Explorer 9+
-
Apple Safari 4+
-
Opera 10.5+
