The HTML Element
The HTML Element
Video
❮ PreviousNext ❯
Example
Courtesy of Big Buck Bunny:
Try it Yourself »
Example
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Try it Yourself »
How it Works
The controls attribute adds video controls, like play, pause, and volume.
It is a good idea to always include width and height attributes. If height and width are not set, the page might flicker
while the video loads.
The <source> element allows you to specify alternative video files which the browser may choose from. The browser
will use the first recognized format.
The text between the <video> and </video> tags will only be displayed in browsers that do not support
the <video> element.
Example
<video width="320" height="240" autoplay>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Try it Yourself »
Note: Chromium browsers do not allow autoplay in most cases. However, muted autoplay is always allowed.
Example
<video width="320" height="240" autoplay muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Try it Yourself »
Browser Support
The numbers in the table specify the first browser version that fully supports the <video> element.
Element
MP4 video/mp4
WebM video/webm
Ogg video/ogg
This allows you to load, play, and pause videos, as well as setting duration and volume.
There are also DOM events that can notify you when a video begins to play, is paused, etc.
Play/Pause Big Small Normal
Try it Yourself »