HTML / HTML Tags

HTML <Progress> Tag

Oct 12, 2022
2 min read
HTML progress Tag

Definition

The <progress> tag represents the status of completion of a task.

Example

<progress value="42" max="100"> 42% </progress>
42%

Usage

  • Both the opening and closing tag is required.
  • Two attributes indicate the status of the current task. The value attribute indicates how much work has been done, and the max attribute indicates the total work required to complete. The units of these measurements are arbitrary and not specified.
  • If the value attribute is not specified, the status will show zero percent completed.
  • If the max attribute is not specified, the default of one will be used.
  • The minimum value is always zero.
  • You should include a textual representation of the progress bard as the content of the <progress> element.
  • The <progress> element should be used to indicate the progress of a task. If you wish to display a gauge, the <meter> element is more appropriate.

Attributes

The Progress element supports the Global Attributes, along with the following:

  • value

    The value attribute specifies the current progress on the task.. If the value is unspecified, the value equals zero. If outside of the range, it will take the value equal to the range’s nearest end. It must be a valid floating-point number.

  • max

    The max attribute specifies the total amount required to complete the task. This must be a valid floating-point number. The default value is one.

Specification

Browser Support

Desktop

ChromeEdgeFirefoxIEOperaSafari
YesYesYesYesYesYes

Mobile

Android WebviewChrome AndroidFirefox AndroidOpera AndroidiOS SafariSamsung Internet
YesYesYesYesYesYes