The <video> Tag
The <video> tag is used to add video clips on web pages. Video tags may have one or more video sources of different formats and the browser will pick the first source it supports. If the browser fails to support the video element then it will display the text between the <video> and </video> tags. Html supports MP4, WebM, and OGG video formats.
Attributes of <video> tag
controls: This will add basic buttons (such as a play/pause button etc) to the Video content.autoplay: With this attribute video content will automatically start playing.loop: Make the video start again every time, whenever it finishes.muted: By default turned off the sound of video content.preload: Specifies if and how the video should be loaded when the page loads.poster: Specifies an image to display while the video is downloading or until the user hits the play button.width: Used to set the width of video content.height: Used to set the height of video content.SCR: To give the URL or path of the video file to embed.
EXAMPLE :
<video controls>
<source src=”http://techslides.com/demos/sample-videos/small.ogv” type="video/ogg">
<source src="/build/videos/arcnet.io(7-sec).mp4" type="video/mp4">
</video>
OUTPUT :
The <audio> Tag
The <audio> tag is very similar to the <video> tag, with a few small differences as mentioned below.
The tag doesn't support the width/height attributes as there is no visual component.
The poster attribute is also not required same reason no visual component.
Attributes of <audio> tag
controls: It displays audio control.muted: When the page is loaded audio will be automatically muted.loop: It will start the audio again when it is finished.preload: It specifies how the author thinks the audio will le loaded when the page is ready (audio metadata).src: It specifies the URL of the audio file.
EXAMPLE :
<!DOCTYPE html>
<html>
<body>
<audio controls>
<source src="https://lenadesign.org/wp-content/uploads/2021/07/Wooden-Train-Whistle.mp3" type="audio/mpeg">
</audio>
</body>
</html>
OUTPUT :
