Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

How do i insert a video? How the video is inserted into the page


May 29, 2021 Article blog



HTML is powerful, basically all static effects can be easily rendered here, a variety of video sites have a large amount of video content, this article teaches you how to insert video in html

The code is as follows:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>video - 编程狮(w3cschool.cn)</title>
<style>
</style>
</head>
<body>
    <video width="320" height="240" controls>
        <source src="/statics/demosource/movie.mp4"  type="video/mp4">
        <source src="/statics/demosource/movie.ogg"  type="video/ogg">
        您的浏览器不支持 HTML5 video 标签。
    </video>
</body>
</html>

Label definition and instructions for use

<video> tags define video, similar to power clips and other video streams.

<video> supports three video formats so far: Ogg, WebM, MP4

browser MP4 WebM Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES
Start with Firefox 21
The Linux system starts with Firefox 30
YES YES
Safari YES NO NO
Opera YES
Start with Opera 25
YES YES

< video > optional properties

attribute value description
autoplay autoplay If this property appears, the video plays as soon as it is ready.
controls controls If this property appears, controls, such as play buttons, are displayed to the user.
height pixels Set the height of the video player.
loop loop If this property appears, it starts playing again when the media file is finished playing.
muted muted If this property appears, the audio output of the video is muted.
poster URL Specify the image that the video will display while it is being downloaded until the user clicks the play button.
preload auto
metadata
none
If this property appears, the video loads when the page loads and is ready to play. If you use autoplay, the property is ignored.
src URL The URL of the video to play.
width pixels Set the width of the video player.

Here's how to insert the entire contents of the video in the html that the editor brings you.