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