HTML Audio

On a web page, the HTML audio element is used to play an audio file.

It is also used for audio loop, audio controls, audio element, audio and video, audio volume, audio file, audio preload, audio stop, audio code, audio events

The HTML <audio> Element

The audio element is used in HTML to play an audio file.

This example specifies which audio track to embed using the src attribute on a nested source element. It is always useful to include the file's MIME type inside the type attribute

Example 1: Single source file

<audio controls>
  <source src="html-resources/sample.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

Result of the above code is:


Example 2: Multiple source file

The following example includes multiple source elements to play an audio file. The browser tries to load the first source element if it is able to play it; if not it falls back to the second.

<audio controls>
  <source src="html-resources/sample.mp3" type="audio/mpeg">
  <source src="html-resources/sample.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>

Result of the above code is:


It is also used for audio tag controls, audio tag preload, audio tag loop, audio tag syntax, audio tag not working, audio tag supported formats, audio tag volume, audio element properties, audio element play, audio element attributes, audio element stop

HTML Audio - How It Works

Audio controls like playing, stop and volume are provided through the controls property.

You can give alternative audio files from which the browser may select the source element. The first recognised format is used by the browser.

Only in browsers which are not supporting audio is displayed the text between audio and /audio.

It is also used for how to insert audio and how to embed audio files in html, html audio player code, audio controls style, audio controls only play button and controls disable download, audio source type, audio source url audio change source and dynamic source

HTML <audio> Autoplay

Use the autoplay property to start an audio file automatically. Most Chromium browsers do not support autoplay. Muted autoplay, on the other hand, is always permitted.

Add mute to allow your audio file to automatically start playing (but mute):

Example

<audio controls>
  <source src="html-resources/sample.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

Result of the above code is:


It is also used for audio autoplay not working, audio autoplay loop hidden, audio autoplay on page load, audio autoplay codepen

HTML Audio Formats

There are three supported audio formats: MP3, WAV, and OGG. The browser support for the different formats is: 

Browser MP3 WAV OGG
Edge/IE YES YES* YES*
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES
It is also used for play audio format support, stream audio format, embedded and multiple audio files

HTML Audio - Media Types

File Format Media Type
MP3 audio/mpeg
OGG audio/ogg
WAV audio/wav
It is also used for audio-media types and format, audio media group, audio visual media types

HTML Audio - Methods, Properties, and Events

The HTML DOM specifies the  audio element functions, characteristics and events.

You can charge, play, and pause the audios, and set time and volume. This is also possible.

DOM events may also inform you when an audio is playing, stopped, etc.

It is also used for embed an audio file to three different audio players on, audio dom current time property, audio event ended, audio event listeners, audio pause, play, load, stop, click and progress event