<meter> tag in HTML5
The <meter> tag is used to indicating a scalar measurement within a known range ("measure data within a given range"), or a fractional value. The <meter> is also called a gauge.
Important Description
- The <meter> tag is new in HTML5.
- The <meter> tag should not be used to indicate progress. Use the <progress> tag for progress bars.
- You can apply CSS style code in <meter> tag.
- Open & close tag required of <meter>.
Syntax Example
<meter value="value_number" min="min_range" max="max_range"></meter>
Example of <meter> tag
The <meter> tag should be used to display disk usage, voting population etc.
Result Look Like
Display a gauge:
Total Score: 3 out of 10
Disk Usage: 80%
Level: Very High
<meter> Tag Browser Support
| Element |
Chrome |
Edge |
Firefox |
Safari |
Opera |
Internet Explorer |
| <meter> |
Yes |
Yes |
Yes |
Yes |
Yes |
No Support |
| Version |
8.0 |
13.0 |
6.0 |
6.0 |
11.0 |
No Support |
Global Attributes
Event Attributes
Attributes
| Attribute |
Value |
Description |
| value |
number |
Value attribute is a mandatory which is used to specify a value in numbers. The number may be integer or floating point number |
| form |
form_id |
It specifies one or more forms to which meter element belongs to |
| high |
number |
Give a range that is considered as high value |
| low |
number |
Give a range that is considered as low value |
| max |
number |
Set the maxmum value defined in the range |
| min |
number |
Set the minimum value defined in the range |
| optimum |
number |
Specifies the optimum value for the <meter> |