You can use this tutorial template to learn how to add videos to your webpage.
<video src="video.mp4" controls></video>
The <video> tag is used to embed a video file in an HTML page. It requires a src attribute and commonly uses the controls attribute to display playback controls.
Attributes you can use in the <video> tag:
Here is an example of how to add a video:
<video src="https://example.com/video.mp4" controls width="400" height="300"></video>
This will display a video with playback controls and a size of 400 by 300 pixels. See an example below:
Browser version support for the <video> tag:
| Chrome | Edge | Firefox | Safari | Opera | |
|---|---|---|---|---|---|
| <video> | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |
| autoplay | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |
| controls | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |
| height | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |
| loop | 4.0 | 9.0 | 11.0 | 3.1 | 11.5 |
| muted | 30.0 | 10.0 | 11.0 | 5.0 | Yes |
| poster | 4.0 | 9.0 | 3.6 | 3.1 | 10.5 |
| preload | 4.0 | 9.0 | 4.0 | 3.1 | 10.5 |
| src | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |
| width | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |
Now you know how to add videos! You can go back to the image tutorial or explore more advanced HTML tags.