HTML Audio
Last Updated :
27 Dec, 2023
The HTML Audio offers the <audio> element, that allows websites to provide background music, sound effects, or play any audio content required for the website and enhance the overall user experience. The element <source> is wrapped inside the <audio> element that defines the source of the audio files as a value of an attribute src.
Syntax
<audio>
<source src="sample.mp3" type="audio/mpeg">
</audio>
Note: Additionally, there are three formats supported including MP3, WAV, and OGG, in HTML5. The <audio> supports the global attributes and event attributes.
Functionality of HTML Audio
- The controls attribute specifies which controls including volume, play, and pause on the audio player.
- Autoplay designates that the audio file will play as soon as controls are loaded.
- The attribute loop specifies that the audio file is set to continuously repeat.
- The attribute src defines the URL of the audio file.
- The attribute muted specifies the audio file should be muted.
- The mp3 file format with media type audio/mpeg.
- The ogg file format with media type audio/ogg.
- The wav file format with media type audio/wav.
HTML <audio> Autoplay
The autoplay attribute is used to start an audio file automatically.
Example: The example illustrates the HTML audio with the attribute autoplay.
HTML
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content =
"width=device-width, initial-scale=1.0" >
< title >HTML Audio</ title >
</ head >
< body >
< div >
< p >Audio Controls Autoplay</ p >
< audio controls autoplay>
< source src = "testAudio.mp3"
type = "audio/mpeg" >
</ audio >
</ div >
< div >
< p >Audio Controls Autoplay Muted</ p >
< audio controls autoplay muted>
< source src = "testAudio.mp3"
type = "audio/mpeg" >
</ audio >
</ div >
< div >
< p >Audio Controls Autoplay Loop</ p >
< audio controls autoplay loop>
< source src = "testAudio.mp3"
type = "audio/mpeg" >
</ audio >
</ div >
</ body >
</ html >
|
Output:
Browser Support
- Google Chrome 3
- Firefox: 3.5
- Opera: 10.5
- Safari: 3.1
- The ogg audio file is not supported by safari.
Share your thoughts in the comments
Please Login to comment...