HTML Introduction

HTML Basic Syntax

HTML Block Element

HTML Formatting

HTML Quotation

HTML Links

HTML List

HTML Table

HTML Audio

HTML Video

HTML Image

HTML Iframe

HTML Favicon

HTML Form

HTML Input Types

HTML Marquee

HTML Meta tag

Learn CSS

Learn Javascript

Learn Django

HTML video tag

How to add video in a html page?

We use video tag for add video in a html page. In video tag there is a attribute name src means source. We pass the path/name.extension in src attribute. After giving correct path then the browser will display the video on the web page. If html file and video files are in the same folder then you don't need to give the file path. But if both are different folders then must give the path of the video. We can also give link if we want take file from internet

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>

<audio src="movie.mp4" ></audio>
<audio src="F:\HTML/movie.mp4" >Audio file is missing.</audio>

</body>
</html>

Some attributes of video tag:

1. Controls: We use controls attribute and pass controls as value so that user can control the video track.
2. autoplay: We use autoplay attribute and pass autoplay as value for autoplay the video after loading the page.
3. preload: we use preload attribute and give auto as value to preload the video track.
4. muted: we use muted attribute and pass muted as value to create mute option.
5. loop: We use loop attribute and pass loop as value for autoplay audio after ending.
6. height: We use height attribute for adjust the height of the video.
7. width: We use width attribute for adjust the width of the video.
If we write something message before the video ending tag then it will be displayed if the browser doesn't support the video format .

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>

<audio src="my_audio.mp3" controls="controls" autoplay="autoplay" preload="auto"></audio>
<audio src="F:\HTML/my_audio.mp3" muted="muted" loop="loop">Audio file is missing.</audio>

</body>
</html>

CodersAim is created for learning and training a self learner to become a professional from beginner. While using CodersAim, you agree to have read and accepted our terms of use, privacy policy, Contact Us

© Copyright All rights reserved www.CodersAim.com. Developed by CodersAim.