How to Embed Any Video in HTML
In an example below, let’s write a code and insert a video on our webpage.
<body> <video width="320" height=260" controls> <source src = "https://rb.gy/96xvu" type= "video/mp4"> Your browser doesn't support this of video. </video> </body>
In an above code the
<video> element is used to insert a video on a web page. Inside the video element the
width attributes are usec to set the height and width of the video. The controls property is used to control the video on a web page (stop or pause the video).
After that we have used the
<source> tag followed by the
src attribute then between the double we have paste the URL of the video that we want to insert on a web page. The text after the
<source> tag is displayed only when the video file failed to load on a web page.
It is also a good practice to use video files with different file formats, like this:
<body> <video width="320" height=260" controls> <source src = "video.mp4" type= "video/mp4"> <source src = "video.ogg" type= "video/ogg"> <source src = "video.webm" type= "video/webm"> Your browser doesn't support this of video. </video> </body>
In case if any web browser doesn’t support the mp4 file it will sure support any one among other two file formats.
Embed YouTube Video in HTML
To embed YouTube video in HTML, we have to use an
<iframe> tag. Here is how we can embed a YouTube video.
<body> <h1>Embed YouTube Video.</h1> <iframe width="560" height="320" src="https://youtube.com/embed/VIDEO ID> </iframe> </body>
How to Get Video ID
To get a video ID of a YouTube video we need to open that video, right click on it go to “stats for nerds“.
and copy the video ID.
Now paste this video ID in your code like this:
<body> <h1>Embed YouTube Video.</h1> <iframe width="560" height="320" src="https://youtube.com/embed/4FVYdV09-RY / RXPZ JT2E ZXVF"> </iframe> </body>
Share This Post!