HTML AUDIO

Audio can be added to the HTML document using <audio> element.

Before HTML5 audio could not be added this simple way on webpage. Earlier audio could only be played using a plug-in like Flash.

If you want to add any kind of audio message,song,tune etc to your web page then <audio> element can be used.

<audio src="piano.mp3" controls="controls">
        Your browser does not support audio element.
      </audio>

Try It

HTML Audio with multiple format

You can insert one or multiple formats of the same file.The browser will choose the first one which it will be able to play.

Here is an example of audio with different formats.

<audio controls>
  <source src="piano.ogg" type="audio/ogg">
  <source src="piano.mp3" type="audio/mpeg">
  Your browser doesn't support audio element.
</audio>

Try It

HTML Audio attributes

The <audio> element has few attributes which helps in displaying controls and then control the audio.

Few of its attributes are Boolean attributes meaning it has as "TRUE" or "FALSE".

The attributes are following:

src - This is used to give a path of audio file.Instead we can also use <source> for giving file path.
controls - This attribute creates a control for play/pause,volume etc.
autoplay - If this attribute is specified the audio will start playing automatically as soon as page loaded.
loop - This attribute specifies that video will start over again once end.
(for a loop to work you must mention autoplay.)

<audio controls autoplay loop>
  <source src="piano.ogg" type="audio/ogg">
  <source src="piano.mp3" type="audio/mpeg">
  Your browser doesn't support audio element.
</audio>

Try It

❮ Prev Next ❯