HTML Reference Manual

HTML Tag Directory

HTML5: <progress> tag

The HTML progress element (progress) is used to display the completion progress of a task. Although the specification does not specify how the element should be displayed, browser vendors can decide for themselves. However, in most cases, the element is displayed as a progress bar.

Online Example

Mark "Download Progress":

Example

!doctype　html>
<html>
<head>
　　<title>HTML5　progress tag usage (Basic Tutorial Website　oldtoolbag.com)</title>
　　<meta　charset="UTF-8">
</head>
<body>
　　　　<p>This　is　a　live　example　of　the　HTML5　element　<a　href="//www.oldtoolbag.com"><progress></a></p>
　　　　<progress　value="70"　max="100">70　%</progress>
</body>
</html>

Test and see ‹/›

Browser Compatibility

IEFirefoxOperaChromeSafari

IE 10, Firefox, Opera, Chrome, and Safari 6 supports the <progress> tag.

Note: IE 9 or earlier versions of IE browsers do not support the <progress> tag.

Definition and usage instructions of the tag

<progress> tag defines the progress of a running task (process).

HTML 4.01 and HTML5difference between

<progress> tag is an HTML5 new tag in

Tips and notes

Tip:Tip: Use the <progress> tag with JavaScript to display the progress of a task.

Note:<progress> tag is not suitable for representing measures (such as disk space usage or related query results). To represent measures, please use <meter> tag replaces

Attribute

New: HTML5 new attribute in

Attribute	Value	Description
maxHTML5	number	Specifies the value that needs to be completed.
valueHTML5	number	Specifies the current value of the process.

Global attributes

Support for <progress> tag Global attributes of HTML.

Event attributes

Support for <progress> tag HTML event attributes.

HTML: <q> tag HTML: <picture> element