Overview

In this article, we will learn about Video and Audio tags of HTML. The <video> tag is used to embed video content in a document, such as a movie clip or other video streams. The <audio> tag is used to embed sound content in a document, such as music or other audio streams. HTML gives you two tags <video> and <audio>. We will learn a lot about these two in this article, so make sure you read this till the end.

Audio Tag:

The audio tag is used to embed audio content, such as music or spoken word, into a web page. It is a self-closing tag, meaning that it does not require a separate closing tag. The audio tag has several attributes that can be used to customize the appearance and functionality of the audio player, including:

• "src": Specifies the URL of the audio file to be played

• "controls": Adds basic audio player controls, such as play, pause, and volume

• "autoplay": Automatically starts playing the audio file when the page loads

• "loop": Causes the audio file to loop continuously

• "preload": Specifies whether the audio file should be preloaded before the page is fully loaded

Here is an example of how to use the audio tag:

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

In this example, the audio file is provided in two different formats, MP3 and Ogg Vorbis, to ensure compatibility with different web browsers. The "controls" attribute adds basic audio player controls, such as play, pause, and volume. If the web browser does not support the audio tag, the fallback message "Your browser does not support the audio element." will be displayed.

Video Tag:

The video tag is used to embed video content into a web page. It is similar to the audio tag in many ways, but with a few additional attributes to control the appearance and functionality of the video player. The video tag also supports multiple video formats, including MP4, WebM, and Ogg Theora.

Here is an example of how to use the video tag:

<video controls>
  <source src="video-file.mp4" type="video/mp4">
  <source src="video-file.webm" type="video/webm">
  Your browser does not support the video element.
</video>

In this example, the video file is provided in two different formats, MP4 and WebM, to ensure compatibility with different web browsers. The "controls" attribute adds basic video player controls, such as play, pause, and volume. If the web browser does not support the video tag, the fallback message "Your browser does not support the video element." will be displayed.

In conclusion, the audio and video tags in HTML provide a simple and effective way to embed multimedia content into web pages. By using these tags and their associated attributes, web developers can create customized audio and video players that meet the specific needs of their web projects.

Thanks for reading!

If you found this article helpful, please like and share it Thank you😊

You can connect with me on Linkedin.