`<progress> HTML Tag`

In HTML Tags, New

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more

Element of: What On Earth Is Semantic Markup? (And Why Should You Learn To Write It)
What does <progress> HTML Tag do?: The <progress> element is used to create a progress bar to serve as a visual demonstration of progress towards the completion of task or goal. The max and value attributes are used to define how much progress (value) has been made towards task completion (max).
Display: inline

Contents

1 Code Example
2 Showing Progress
- 2.1 Is Your Progress ‘Task-Related’?
3 Browser Support for progress

Code Example

<progress value="33" max="100"></progress>

Showing Progress

<progress> is a new semantic element in HTML 5. Use it to display a progress bar when a file is being uploaded, or your progress towards a fundraising goal.

Is Your Progress ‘Task-Related’?

The HTML 5 specification says we should use <progress> when displaying the completion of a specific task.

If you need to show a result for something that is not related to a task, you should use <meter>.

Claire Broadley

Claire is seasoned technical writer, editor, and HTML enthusiast. She writes for HTML.com and runs a content agency, Red Robot Media.

Browser Support for progress


11	16	8	13	6	11