Summary -
In this topic, we described about the <audio> tag along with detailed example.
The <audio> element was introduced in HTML 5. Defines sound/music/other audio streams in the HTML document. <audio> tag is commonly used to embed music files to web pages.
MP3, Wav and Ogg are the 3 supported file formats for the <audio> element. MP3 format is supported by all browsers. The URL of the audio file can be specified in between the opening and closing tags <audio src="" controls></audio>.
Any content in between the opening and closing <audio> tags is replacement content if browser not supported the <audio> tag or <audio> format.
Syntax -
<audio>….</audio>
Optional Attributes -
| Attribute | Description | Values |
|---|---|---|
| autoplay | Specifies the audio can be loading and playing will be done automatically. | None. |
| controls | Instructs the web browser to apply browsers in-built set of user controls (to stop, play, mute, etc.). | None. |
| crossorigin | Used to handle Cross Origin Resource Sharing requests in conjunction with JavaScript | |
| loop | Specifies that replay the audio once it has finished. | None. |
| mediagroup | Used to group several audio and/or video elements together. | Text. |
| muted | Specifies that mute the audio resource by default. | None. |
| preload | Specifies the size of the audio file should be buffered. |
none: specifies fetch audio data once playback has been appealed. metadata: Fetch the duration data. auto: User specification comes before server |
| src | Specifies the location of the audio file. | URL. |
Example -
<!DOCTYPE html>
<html>
<head>
<title> aside example</title>
</head>
<body>
<audio src="new.mp3" controls>
<p> Song new.mp3 not supported by browser </p>
</audio>
<!-- web page content -->
</body>
</html>