description & Usage
The <video> tag is used to add videos or any kind of video media to an HTML document.
The <video> tag includes one or more <source> tags to specify the URLs of the video sources.
We can use one or multiple <source> tags with different file extensions. The browser will automatically play the first video file that it supports.
Here are four important attributes of the <video> tag:
The autoplay attribute: specifies to play the video automatically.
The controls attribute: displays the video control buttons.
The width attribute: specifies the width of the video frame.
The height attribute: specifies the height of the video formats supported by browsers include: MP4, WebM, and OGG.
| format | edge | chrome | fire fox | safary | opera |
|---|---|---|---|---|---|
| MP4 | yes | yes | yes | yes | yes |
| WebM | yes | yes | yes | yes | yes |
| OGG | yes | yes | yes | no | yes |
Please have a look at the <audio> tag page.
Notes
Note: You can also introduce audio files to the <video> tag by using the src attribute without using the <source> tag.
<video src="/video.mp4"></video>Note: If the browser does not support the <video> tag, the text inside the <video> tag will be displayed.
<audio src="/video.mp4">Your browser not support video</video>Note: You can also use the <embed> tag to display video but it is recommended to use the <video> tag.
Browser compatibility and Support
| # | Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| <video> |
Global Attributes
The <video> tag supports the HTML Global Attributes.
Event Attributes
The <video> tag supports the HTML Event Attributes.
