HTML `<progress>`

Baseline

20157

<progress> HTML

<label for="file">:</label>

<progress id="file" max="100" value="70">70%</progress>

label {
  padding-right: 10px;
  font-size: 1rem;
}

max: progress max 0 1
value: 0 max max 0 1 value

: <meter> 0 min <progress>

: :indeterminate element.removeAttribute('value') value

<progress> ARIA aria-labelledby aria-label role="progressbar" <progress> <label>

html

<label>
  : <progress value="70" max="100">70 %</progress>
</label>

<!-- OR -->
<br />

<label for="progress-bar"></label>
<progress id="progress-bar" value="70" max="100">70 %</progress>

<progress> aria-describedby aria-busy="true" aria-busy

html

<div aria-busy="true" aria-describedby="progress-bar">
  <!--  -->
</div>

<!-- ... -->

<progress id="progress-bar" aria-label=""></progress>

html

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


	`<progress>`


ARIA	`progressbar`
ARIA	`role`
DOM	`HTMLProgressElement`


HTML # the-progress-element

MDN

MDN 2026623

GitHub

HTML <progress>

MDN

HTML `<progress>`