English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
The HTML <video> element is used to embed media players in HTML or XHTML documents, supporting video playback within the document. You can also use the <video> tag for audio content, but the <audio> element may be more suitable for user experience.
Play video through video:
!doctype html> <html> <head> <meta charset="UTF-8"> <title>HTML video tag usage (Basic Tutorial Website oldtoolbag.com)</title> </head> <body> <video controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.webm" type="video/webm"> <p>Your browser doesn't support HTML5 video. Here is a <a href="movie.mp4">link to the video</a> instead.</p> </video> </body> </html>test to see if </›
IEFirefoxOperaChromeSafari
All mainstream browsers support.
The <video> tag defines a video, such as a movie clip or other video stream.
Currently, the <video> element supports three video formats: MP4and WebM, Ogg.
| browser | MP4 | WebM | Ogg |
|---|---|---|---|
| Internet Explorer | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES from Firefox 21 version started Linux system from Firefox 30 started | YES | YES |
| Safari | YES | NO | NO |
| Opera | YES from Opera 25 version started | YES | YES |
MP4 = MPEG 4files use H264 video codec and AAC audio codec
WebM = WebM files use VP8 video codec and Vorbis audio codec
Ogg = Ogg files use Theora video codec and Vorbis audio codec
| format | MIME-type |
|---|---|
| MP4 | video/mp4 |
| WebM | video/webm |
| Ogg | video/ogg |
The <video> tag is an HTML5 new tag.
Tip:can be placed between <video> and </The text is placed between the <video> tags, so that browsers that do not support the <video> element can display the information of this tag.
New : HTML5 new attributes in
| Attribute | Value | Description |
|---|---|---|
| autoplayHTML5 | autoplay | If this attribute is present, the video will start playing immediately after it is ready. |
| controlsHTML5 | controls | If this attribute is present, controls such as play buttons are displayed to the user. |
| heightHTML5 | pixels | Set the height of the video player. |
| loopHTML5 | loop | If this attribute is present, the media file will start playing again after it is completed. |
| mutedHTML5 | muted | If this attribute is present, the audio output of the video is muted. |
| posterHTML5 | URL | Specify the image to be displayed while the video is downloading, until the user clicks the play button. |
| preloadHTML5 | auto metadata none | If this attribute is present, the video is loaded and prepared for playback when the page is loaded. If 'autoplay' is used, this attribute is ignored. |
| srcHTML5 | URL | URL of the video to be played. |
| widthHTML5 | pixels | Set the width of the video player. |
Support for <video> tag Global attributes of HTML.
Support for <video> tag HTML event attributes.