HTML5 <audio> Tag

Topic: HTML5 Tags ReferencePrev|Next


The <audio> element is used to embed audio content in an HTML document without requiring any additional plug-in like Flash player.

The following table summarizes the usages context and the version history of this tag.

Placement: Block
Content: <source>, <track>, and text
Start/End Tag: Start tag: required, End tag: required
Version: New in HTML5


The basic syntax of the <audio> tag is given with:

HTML / XHTML: <audio> ... </audio>

The example below shows the <audio> tag in action.

<audio controls="controls" src="birds.mp3">
    Your browser does not support the HTML5 Audio element.

An audio, using the browser default set of controls, with alternative sources.

<audio controls="controls">
    <source src="birds.mp3" type="audio/mpeg">
    <source src="birds.ogg" type="audio/ogg">
    Your browser does not support the HTML5 Audio element.

Tip: You can place content such as text or download link inside an audio element to provide alternate content in case, if the browser does not support the audio content or somehow failed to download the audio source file.

Tag-Specific Attributes

The following table shows the attributes that are specific to the <audio> tag.

Attribute Value Description
autoplay autoplay This Boolean attribute specifies that the audio will automatically start playing as soon as it can do so without stopping to finish loading the data.
controls controls If specified, the browsers will display controls to allow the user to control audio playback, such as play/pause, volume, etc.
loop loop This Boolean attribute specifies that the audio will automatically start over again, upon reaching the end.
muted muted This Boolean attribute specifies whether the audio will be initially silenced. The default value is false, meaning that the audio will be played.
preload auto
Provides a hint to the browser about whether to download of the audio itself or its metadata. The autoplay attribute can override this attribute, because if you want to automatically play a audio, the browser will obviously need to download it.
src URL Specifies the location of the audio file. Alternatively, you can use the preferred <source> tag as it allows for multiple options.

Global Attributes

Like all other HTML tags, the <audio>tag supports the global attributes in HTML5.

Event Attributes

The <audio> tag also supports the event attributes in HTML5.

Browser Compatibility

The <audio> tag is supported in all major modern browsers.

Browsers Icon

Basic Support—

  • Firefox 3.5+
  • Google Chrome 4+
  • Internet Explorer 9+
  • Apple Safari 4+
  • Opera 10.5+

Further Reading

See tutorial on: HTML5 Audio, HTML5 Video.

Related tags: <source>, <track>, <video>.

Bootstrap UI Design Templates