The HTML <audio> element is used to play audio files on a web page.
To play an audio file in HTML, use the <audio> element as shown below.
<audio controls>
<source src="audio.ogg" type="audio/ogg">
<source src="audio.mp3" type="audio/mpeg">
Audio element is not supported by your browser.
</audio>
How It Works
The controls attribute adds audio controls, such as play, pause, and volume.
The <source> element allows you to specify alternative audio files for the browser to choose from, using the first recognized format.
The text between the <audio> and </audio> tags will be displayed only in browsers that do not support the <audio> element.
Autoplay
To have an audio file start automatically, use the autoplay attribute:
<audio controls autoplay>
<source src="audio.ogg" type="audio/ogg">
<source src="audio.mp3" type="audio/mpeg">
Audio element is not supported by your browser.
</audio>
Note: Usually autoplay is not supported in Chrome, but muted autoplay is always allowed.
Add muted after autoplay to let your audio file start playing automatically in mute mode.
<audio controls autoplay muted>
<source src="audio.ogg" type="audio/ogg">
<source src="audio.mp3" type="audio/mpeg">
Audio element is not supported by your browser.
</audio>
HTML Audio Media Types
HTML audio element supports the following media types:
MP3: audio/mpeg
OGG : audio/ogg
WAV: audio/wav
HTML Audio Browser Support
The browser support for the different formats is:
Edge/IE: MP3 - WAV - OGG
Chrome: MP3 - WAV - OGG
Firefox: MP3 - WAV - OGG
Safari: MP3 - WAV
Opera: MP3 - WAV - OGG
Please check below options for the links to our previous or next tutorial.