HTML Audio and Video tags

HTML Audio and Video tags

How we can insert an audio or video file in our webpage?

Audio tag:-

The audio tag in HTML is used to embed sound content in a document, such as music.the audio tag contains one or more tags with different audio sources.

In simple words we can say that The <audio\> tag creates an audio player on a web page. It supports media controls, like play, pause, volume, and mute.

Example:-

<audio src="./image/Bholenath_-_Sumit_Goswami__Kaka__Shanky_Goswami__Latest_Haryanvi_Song_2018.mp3" controls>
</audio>

Some of the attributes that are used in the audio tag :-

1. autoplay:- It specifies that the audio will start playing as soon as it is ready.

2.controls:- it specifies the audio controls that should be displayed. such as a play button /pause button etc).

3. muted:- Specifies that the audio output should be muted.

4. preload:- Specifies if and how the author thinks the audio should be loaded when the page loads.

5. loop:- Specifies that the audio will start over again, every time it is finished.

6. src (URL):- Specifies the URL of the audio file.

Video tag:-

The video tag in HTML is used to embed video content in a document, such as a movie clip or other video streams. the video tag contains one or more source tags with different video sources. The browser will choose the first source it supports.its attribute is almost similar to audio tag.

Example:-


 <video autoplay muted  class="video">
    <source src="./img/IN_everyday_essentials_desktop_v5.mp4">
 </video>

Attributes for Video tag

1. autoplay:- Specifies that the video will start playing as soon as it is ready.

2.buttons:-Specifies that video controls should be displayed (such as a play/pause button etc).

3. height(pixels):-Sets the height of the video player.

4.loop:-Specifies that the video will start over again, every time it is finished.

5.muted:-Specifies that the audio output of the video should be muted.

6.poster:-Specifies an image to be shown while the video is downloading, or until the user hits the play button.

7.preload:-Specifies if and how the author thinks the video should be loaded when the page loads.

8.src:-Specifies the URL of the video file.

9. width(pixels):-Sets the width of the video player.

Here's all about Audio and Video tags. Hope it will be useful for you.