Home Web Front-end H5 Tutorial What does the HTML5 tag mean? Detailed explanation of the basic usage of HTML5 tag

What does the HTML5 tag mean? Detailed explanation of the basic usage of HTML5 tag

Aug 16, 2018 pm 05:39 PM

HTML5What does the tag mean? What are the basic uses of content in the HTML5 tag? This article will introduce to you what the HTML5 tag is, what are the basic attributes of the HTML5 tag and the basic usage of these attributes

First we need to understand what the HTML5 tag is What it means: The

label indicates the progress (process) of the task.

In HTML, the tag is used to define the progress (process) of running tasks. The tag is often used with JavaScript to display the progress of a task. The tag is not suitable for the representation of weights and measures. Generally, the tag is used.

Basic attributes of the tag:

max: Specifies the value that needs to be completed (value: number).

value: Specifies the current value of the process (value: number).

tag supports html global attributes and html event attributes

Format:

<progress value="当前值" max="目标值">
</progress>
Copy after login

Here are examples:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>html5< progress>标签笔记_PHP笔记</title>
</head>
<body>
上传进度:
<progress value="49" max="100">
</progress>
</body>
</html>
Copy after login

Running results :

What does the HTML5 <progress> tag mean? Detailed explanation of the basic usage of HTML5 <progress> tag

Tag Notes html No. 1 " title="html5< progress> Tag Notes html No. 1 - Guoge Notes" > Tag Notes" alt ="" width="469" style="max-width:90%" />

HTML5Attributes of tag:

What does the HTML5 <progress> tag mean? Detailed explanation of the basic usage of HTML5 <progress> tag

Downloading example in progress:

<progress value="22" max="100"></progress>
Copy after login

Basic usage of HTML5 tag:

<html>
<dead>
<meta charset="UTF-8">
<style type="text/css">
</style>
<script>
function test(){
var kk = document.getElementById("pro1");
   kk.value=kk.value+1;
}
</script>
</dead>
<body>
<progress value="10" max="100" id="pro1"></progress>
<script>
var s= self.setInterval("test()",1000);/*使用window自带的函数 setInetrval来重复执行test函数
实现progress的value值得自增长,模拟progress的使用*/
</script>
</body>
</html>
Copy after login

Tips and notes for HTML5 tag:

Tip: Please use the tag with JavaScript to display the progress of the task.

Note: The tag is not suitable for representing metrics (for example, disk space usage or query results). To represent weights and measures, use the tag instead.

Differences between HTML 4.01 and HTML 5

The tag is a new tag in HTML 5.

Browser support

Internet Explorer 10, Firefox, Opera, Chrome and Safari 6 support the tag.

Note: Internet Explorer 9 and earlier versions do not support the tag.

[Related recommendations]

What is the article tag in HTML5? Where is the article element used in HTML5?

#What are the new structural elements in HTML5? Usage of new structural elements in HTML5 (recommended)


The above is the detailed content of What does the HTML5 tag mean? Detailed explanation of the basic usage of HTML5 tag. For more information, please follow other related articles on the PHP Chinese website!

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

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
1 months ago By 尊渡假赌尊渡假赌尊渡假赌
Two Point Museum: All Exhibits And Where To Find Them
1 months ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to Add Audio to My HTML5 Website? How to Add Audio to My HTML5 Website? Mar 10, 2025 pm 03:01 PM

This article explains how to embed audio in HTML5 using the &lt;audio&gt; element, including best practices for format selection (MP3, Ogg Vorbis), file optimization, and JavaScript control for playback. It emphasizes using multiple audio f

How to Use HTML5 Forms for User Input? How to Use HTML5 Forms for User Input? Mar 10, 2025 pm 02:59 PM

This article explains how to create and validate HTML5 forms. It details the &lt;form&gt; element, input types (text, email, number, etc.), and attributes (required, pattern, min, max). The advantages of HTML5 forms over older methods, incl

How do I handle user location privacy and permissions with the Geolocation API? How do I handle user location privacy and permissions with the Geolocation API? Mar 18, 2025 pm 02:16 PM

The article discusses managing user location privacy and permissions using the Geolocation API, emphasizing best practices for requesting permissions, ensuring data security, and complying with privacy laws.

How do I use the HTML5 Page Visibility API to detect when a page is visible? How do I use the HTML5 Page Visibility API to detect when a page is visible? Mar 13, 2025 pm 07:51 PM

The article discusses using the HTML5 Page Visibility API to detect page visibility, improve user experience, and optimize resource usage. Key aspects include pausing media, reducing CPU load, and managing analytics based on visibility changes.

How do I use viewport meta tags to control page scaling on mobile devices? How do I use viewport meta tags to control page scaling on mobile devices? Mar 13, 2025 pm 08:00 PM

The article discusses using viewport meta tags to control page scaling on mobile devices, focusing on settings like width and initial-scale for optimal responsiveness and performance.Character count: 159

How to Create Interactive Games with HTML5 and JavaScript? How to Create Interactive Games with HTML5 and JavaScript? Mar 10, 2025 pm 06:34 PM

This article details creating interactive HTML5 games using JavaScript. It covers game design, HTML structure, CSS styling, JavaScript logic (including event handling and animation), and audio integration. Essential JavaScript libraries (Phaser, Pi

How do I use the HTML5 Drag and Drop API for interactive user interfaces? How do I use the HTML5 Drag and Drop API for interactive user interfaces? Mar 18, 2025 pm 02:17 PM

The article explains how to use the HTML5 Drag and Drop API to create interactive user interfaces, detailing steps to make elements draggable, handle key events, and enhance user experience with custom feedback. It also discusses common pitfalls to a

How do I use the HTML5 WebSockets API for bidirectional communication between client and server? How do I use the HTML5 WebSockets API for bidirectional communication between client and server? Mar 12, 2025 pm 03:20 PM

This article explains the HTML5 WebSockets API for real-time, bidirectional client-server communication. It details client-side (JavaScript) and server-side (Python/Flask) implementations, addressing challenges like scalability, state management, an

See all articles