This article mainly introduces the use and introduction of video tags in html, HTML5 videos, and some video formats that support video playback in the web, so let's take a look at this article.
First we introduce the following tags for playing the video:
Html5<video> label:<video> tags define videos, such as movie clips or other video streams.
Video on the web until now, there is still no standard for displaying video on a Web page.
Today, most videos are displayed via plugins (such as Flash). However, not all browsers have the same plugin.
HTML5 provides a standard way to include video through the visual element.
A simple example of HTML5 video:
<video src= "Movie.ogg" controls= "Controls" > your browser does not support video tags. </video>
This text will appear on the page when the video is not found.
HTML5 Video format:
Currently, the video element supports three types of videos:
OGG = Ogg file with Theora video encoding and Vorbis audio encoding
MPEG4 = MPEG 4 file with H + video encoding and AAC audio encoding
WebM = WebM file with VP8 video encoding and Vorbis audio encoding
Now talk about how the HTML5 video tag plays videos on a Web page:
1. Basic usage:
<video src= "Hangge.mp4" controls></video>
2. Set the video window size by width and height:
<video src= "Hangge.mp4" Controls Width= "height=" ></video>
3. Pre-load media files:
Setting preload different property values tells the browser how to load a media file:
Value Auto: Let the browser download the entire file automatically
The value is none: The browser does not have to download the file beforehand
The value is metadata: Let the browser first get the data block at the beginning of the video file, enough to determine some basic information (such as the total length of the video, the first frame image, etc.)
<!--users click Play to start downloading--><video src= "Hangge.mp4" Controls preload= "None" ></video>
4. Auto Play:
(1) Using the AutoPlay property allows the browser to play the video file as soon as it is finished loading.
<video src= "Hangge.mp4" Controls autoplay></video>
(2) If AutoPlay is enabled, the player can be set to the muted state. This will mute the AutoPlay and prevent users from getting bored. You can click the Player speaker icon to turn the sound back on if you want.
<video src= "Hangge.mp4" Controls AutoPlay muted></video>
5. Loop Playback:
Use the Loop property to let the video play at the end, and then play back from the beginning.
<video src= "Hangge.mp4" Controls loop></video>
The above is this article about the HTML5 video tag usage and interpretation, there are questions can be in the message below the question.