How to set the maximum value of progress bar using HTML ?
In this article, we are creating the progress bar of a task by using a <progress> tag. The <progress> tag is used to represent the progress of a task. It is also defined how much work is done and how much is left to download a thing. It is not used to represent the disk space or relevant query.
The maximum value of progress bar can be set by using max property value.
Syntax:
<progress attributes...> </progress>
Property Values:
- level: It returns the list of progress bar.
- max: It is used to set or return the progress bar value of max attribute.
- value: It represent the amount of work are already completed.
- position: It returns the current position of progress bar.
Example:
HTML
<!DOCTYPE html><html> <head> <title> How to set the maximum value of progress bar using HTML? </title></head> <body style="text-align: center;"> <h1 style="color:green;"> GeeksforGeeks </h1> <h3> How to set the maximum value of progress bar using HTML? </h3> Downloading progress for a song: <!-- Set maximum value of progress bar --> <progress value="57" max="200"> </progress></body> </html> |
Output:
Supported Browsers:
- Google Chrome 8.0
- Internet Explorer 10.0
- Firefox 16.0
- Opera 11.0
- Safari 6.0
Please Login to comment...