HTML <meter> tag
When writing in HTML (hypertext markup language), the <meter> tag is an inline element used to create a gauge with a certain range on a web page. This gauge can be divided into either scalar or fractional values. It is useful for visually displaying where a certain value lies, between some minimum and maximum. For example, showing how much space was used on a hard drive.
The following sections contain information about this tag, including an example of it in use, and related attributes and browser compatibility.
The <meter> tag shouldn't be used to create a progress bar. In those cases, use the <progress> tag.
Example of <meter> code
<p>Your main disk's storage capacity is at: <meter min="0" max="250" value="175">175 out of 250 GB<meter>.</p>
Example result
Your main disk's storage capacity is at:
Attributes
All HTML tags support standard attributes that define the settings of an HTML element. In addition to the standard settings, the <meter> tag has the following unique attributes.
Attribute | Description |
---|---|
form | Designates the form(s) that a <meter> element belongs. |
high | Designates a high value on the gauge's range. |
low | Designates a low value on the gauge's range. |
max | Designates a maximum range within a gauge. |
min | Designates a minimum range within a gauge. |
optimum | Designates an optimal range within a gauge. |
value | Designates the current value of the gauge (required). |
Compatibility
Edge | Internet Explorer | Firefox | Safari | Opera | Chrome |
---|---|---|---|---|---|
All versions | Not supported | 16.0+ | 6.0+ | 11.0+ | 6.0+ |
Browser, Compatibility, Container tag, URL, Web design terms