HTML Video
A video on a Web page will be shown through the HTML video
element.
The HTML <video> Element
Use the video
element to display an HTML video:
Example
Video courtesy of Big Buck Bunny.
Result of the above code is:
The HTML <video> - Multiple Sources
Here we are providing 3 different sources for the media; this allows the video to be watched regardless of which video codecs are supported by the browser.
Example
Result of the above code is:
How it Works
Video controls such as play, pause, and volume, are added with the controls
property.
Always include width
and height
properties in your code. The website may flicker while the video loads if the height and width are not specified.
You may use the source
element to specify other video files for the browser to pick from. The browser will use the first format it recognizes.
Only browsers that do not support the video
element will see the text between the video
and /video
tags.
HTML <video> Autoplay and Muted
Use the autoplay
element to start a video automatically. In most circumstances, Chromium browsers do not
support autoplay, Muted autoplay, on the other hand, is always permitted.
Add muted
 to allow the video to play automatically after auto playback (but muted):
Example
Video courtesy of Big Buck Bunny.
Result of the above code is:
Video courtesy of Big Buck Bunny.
Related Links
HTML Video Formats
There are three supported video formats: MP4, WebM, and Ogg. The browser support for the different formats is:
Browser | MP4 | WebM | Ogg |
---|---|---|---|
Edge | YES | YES | YES |
Chrome | YES | YES | YES |
Firefox | YES | YES | YES |
Safari | YES | YES | NO |
Opera | YES | YES | YES |
HTML Video - Media Types
File Format | Media Type |
---|---|
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
Related Links
HTML Video - Methods, Properties, and Events
For the video
element, the HTML DOM sets methods, attributes, and events.
You may load, play, and break videos and control duration and volume.
DOM events may also tell you whenever a video starts playing, stops, and so on.