How to display completion progress of a task in HTML5?

Use the <progress> tag in HTML5 to display the completion progress of a task. This helps in creating a progress bar. The following are the attributes −

The HTML <progress> tag supports the following additional attributes −

max Max
It should have a value greater than zero and a valid floating-point number.
value value
Specifies how much of the task has been completed. It should be a floating-point number between 0 and max or 0 and 1 if max is omitted.


You can try to run the following code to create a progress bar −

<!DOCTYPE html>
      <title>HTML Progress Tag</title>
      <h2>Water Level</h2>
      <progress value = "60" max = "100"/>