HTML audio tag

Html <audio> tag embeds the audio or sound in a web page. src attribute defines the address of the audio.


<audio  src="files/sample.mp3" controls>  </audio>

Try </>

Specific uses

multiple alternative audios

Some browsers don't support all types of media. Multitype audio resources are used so that if one is not supported the other one will be used.


<audio controls>
<source src="files/sample.mp3" type="audio/mp3" />
<source src="files/sample.ogg" type="audio/ogg" />
<p>Sorry, this media type can not be supported in this browser</p>


Source attribute is necessary to embed multiple audios. Here the difference is of type.

Here we have embedded two different types of audio.

Note: controls attribute must be used in the <audio> tag otherwise audio will not be played.

Related tags

<source> It provides the multiple alternative media resources.
<source src="address of external resource/URL">

Tag omission

Both starting and ending tags are necessary for the audio element.

Global Attributes

All the global attributes are applicable on the audio element.

Related Attributes

<audio> tag attributes

src It specifies the location or address of the audio.
<audio src="address of audio"> </audio>
autoplay This attribute plays the audio automatically after loading.
<audio src="address of audio" autoplay> </audio>
loop This attribute plays the audio automatically from start when it reaches at the end.
<audio src="URL"  loop>  </audio>
muted The audio is muted by default after the page is loaded.
<audio src="" muted > </audio>
controls This attribute gives the controls such as play/pause, volume control.
<audio src="location of audio" controls > </audio>
crossorigin It manages the crossorigin requests.
preload represents how much buffering the audio needs before playback.

Was this article helpful?




Get the newsletter