Implementing Video tag.

Posted by manasvisawant45 on March 3, 2021 5:13 pm


As we saw a <audio> tag in HTML. Video tag is also important as we can embed a video in HTML as well as audio.

The HTML Video element ( <video> ) embeds a media player which supports video playback into the document. You can use <video> for audio content as well.

Below is a code snippet which shows how to use <video> in html.

<!DOCTYPE html>
<html>
<body>
  <video autoplay>
     <source src="TechOceanhub.mp4" type="video/mp4">
 </video>
 <video autoplay>
     <source src="pp.mp4" type="video/mp4">
  </video>
</body>
</html>

You can add several <source>elements inside the <video> element. Each <source> element can link to different video files. The browser will use the first recognized format which is mp4, WebM, Ogg.

Different attributes of video tag:-

autoplay, controls, height, loop, muted, preload, src, width

autoplay: It specifies video will play as soon as it gets ready.

controls: It displays the video controls.

height: It sets the height of video player.

loop: Video will repeat itself over an over again.

muted: With this tag audio output will be muted.

preload: I is done by the user as it refreshes the page to reload the video.

src: I displays the source/location of a video.

width: It sets the width of a video player.

Feel free to read and comment below and try out this example.