progress max attribute
The max attribute on the progress element:
- holds the value that represents the completion of a task (how much work a task requires to be completed)
- its value must be a valid floating-point number
- max is a specific attribute → can be applied ONLY on the next HTML5 elements: input, meter, progress
- is an optional attribute: when not specified, the default values are: min value="0" max value="1"
"value(s)" restrictions:
- max>0
or
max=1 (if max attribute is absent, default value)
Examples
| <progress | attribute | = | "value(s)" | > | ... | <⁄progress> | example |
|---|---|---|---|---|---|---|---|
| 2. | max | = | default 1, valid floating-point number | < value="2" max="9"> ... <⁄> |
Video demonstration progress max attribute
HTML5 progress max attribute Tutorial
| min | video details |
|---|---|
| 00:02 | video tutorial: max attribute on progress element |
| 00:05 | max attribute on progress element holds the value that represents the completion of a task |
| 00:12 | max attribute present, value=500 → when the progression will reach 500, the task will be completed ⁄ finalized |
| 00:19 | max="500" |
| 00:23 | task in progress |
| 00:35 | task completed = it reached the max limit=500 |
| 00:51 | max attribute present, value=500 value attribute present, value=300 → the task progresses starting with the 300 value until it reached its completion, its maximum value of 500 |
| 00:58 | starts with value=300 max=500 |
| 01:15 | max attribute absent, default value=1 value attribute present, value must be between 0 and 1, 0.5 in our case → the progress bar displays half in green |
| 01:28 | - if present, the value of max attribute must be greater than 0 - if absent, by default max=1 → if value attribute specified can be only between 0 and 1 |