The title attribute on a <progress> tag adds a tooltip with title text to the progress bar.
Hovering the mouse over the progress bar will display the tooltip.
A title attribute on a <progress> tag.
Hover over the progress element to see the tooltip.
<div>Calculating cost... </div>
<br />
<progress title="30% Complete" value="30" max="100"> 30% </progress>
The title attribute is placed in the <progress> opening tag.
The value can be any string.
Hover over the progress and after a second a tooltip appears.
The title attributes attaches additional information to the <progress> element.
The title value displays as a tooltip.
The tooltip displays when the <progress> element is hovered.
<progress title="value">
| Value | Description |
|---|---|
| value | A string value. A title can span multiple lines by including newline or carriage-return characters: or 
. |
Here is when title support started for each browser:
 Chrome
|
8.0 | Dec 2010 |
 Firefox
|
16.0 | Oct 2012 |
 IE/Edge
|
10.0 | Sep 2012 |
 Opera
|
11.0 | Dec 2010 |
 Safari
|
6.0 | Jul 2012 |
Back to <progress>
