html video
The
<video>
HTML element embeds a media player which supports video playback into the document.
<video width="320" height="240" controls> <source src="cj.mp4" type="video/mp4"> </video>
- The controls attribute adds video controls, like play, pause, and volume.
- It's always good to include width and height attributes.
html videos
The content inside the opening and closing
<video> </video>
tags is shown as a fallback in browsers that don't support the element.
<video width="320" height="240" controls> <source src="cj.mp4" type="video/mp4"> Your Browser not Supports Video tag </video>
html5 video how to
HTML <video>
Autoplay
<video width="320" height="240" autoplay> <source src="cj.mp4" type="video/mp4"> </video>
- Add
muted
afterautoplay
to let your video start playing automatically
<video width="320" height="240" muted autoplay> <source src="cj.mp4" type="video/mp4"> </video>
Some Important Video Tag Attributes
-
autoplay
- A Boolean attribute, video automatically begins to play. -
controls
- It allows the user to control video playback, including volume, seeking, and pause/resume playback. -
autopictureinpicture
- A Boolean attribute , element should automatically toggle picture-in-picture mode. -
controlslist
- It helps the browser select what controls to show on the media element. Allowed values arenodownload
,nofullscreen
andnoremoteplayback
. -
crossorigin
- It indicates whether to use CORS to fetch the related video. -
disablepictureinpicture
- Prevents the browser from suggesting a Picture-in-Picture context menu. -
disableremoteplayback
- It used to disable the capability of remote playback in devices. -
loop
- The browser will automatically seek back to the start reach the end of the video.
embed video in html
Browsers | Chrome | Edge | Mozilla | Safari | Opera |
---|---|---|---|---|---|
<video> | 4.0 | 9.0 | 3.5 | 3.1 | 11.5 |