Home > Web Front-end > H5 Tutorial > How to insert an auto-playing video into a page using HTML5

How to insert an auto-playing video into a page using HTML5

yulia
Release: 2018-10-30 14:53:09
Original
40114 people have browsed it

Have you ever noticed that there are videos, audios, etc. on the website when you browse the website? Friends who are learning HTML and CSS, do you know how to use HTML5 to insert videos into the page and automatically play them? This article will tell you how to insert videos in html5 and the code for inserting videos in HTML. Interested friends can refer to it.

The

Introduction to tags related to inserting videos:

used to set the resources of the video

can be set in the media player text track

Note: You need to pay attention to the compatibility of the browser when using it, the

How to insert an auto-playing video into a page using HTML5

Example Demonstration 1: How to insert a video into the page using html5

Detailed explanation of the example:
First create the

<video width="300" height="200" controls>
  <source src="movie.ogg" type="video/ogg">
您的浏览器不支持Video标签。
</video>
Copy after login

Effect picture:

How to insert an auto-playing video into a page using HTML5

Instance demonstration 2: Insert a video that can automatically play in the page

Syntax:

Insert a video that can be played automatically on the page. You only need to add one attribute, which is the autoplay attribute of the

<video width="320"  style="max-width:90%" controls autoplay>
  <source src="movie.ogg" type="video/ogg">
  您的浏览器不支持 video 标签。
</video>
Copy after login

After adding the autoplay attribute of the

The above introduces you to the HTML5 method of inserting videos into pages, and how to insert videos that can automatically play. The explanation is detailed and relatively easy to understand. Beginners can try it themselves, find a video and insert it into the page. See if your code can achieve the effect of automatic playback. I hope this article will be helpful to you!

【Related Tutorial Recommendations】

1. Html5 Video Tutorial
2. HTML Development Manual
3. bootstrap tutorial
4. CSS page loading animation effect

The above is the detailed content of How to insert an auto-playing video into a page using HTML5. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template