Audio and video tags

In this article we are understanding about audio and video tags in HTML.

Audio and video tags

<audio> Element

In the audio element, there is no visual component we need to display controls to play the audio.

The audio element does not support the width and height attributes because there are no visual components, so we can't assign width and height. and also it doesn't support poster attribute.

<audio controls>
  <source src="heyyyyy.mp3" type="audio/mp3" />
</audio>

Where,

controls are for controlling audio and src is the source which was the path of the audio file and type is a format of a file.

Output:

<video> element

The video element allows us to embed video.

<video src="rabbit320.webm" controls>
    <a href="rabbit320.webm">Open the video</a> 
</video>

Output:

where,

src is the source attribute contains the path of the video.

controls are give ability to control video and audio playback.

In video tags we can give height and width as our preference.

In video tags we can have our poster which can be played before video starts.