PUBLISHED ON: FEBRUARY 19, 2021
HTML Meter Tag
The <meter> tag is a newly introduced tag in HTML5.
-
The <meter> tag is used to represent either fractional value or a scalar value within a known range.
-
It is recommended not to use this tag to show progress in a progress bar.
-
Always use <label> tag before this in order to best accessibility
HTML <meter> Tag Syntax and Usage
The <meter> tag requires the start(opening) tag and end(closing) tag. The basic syntax for the same is given below:
<meter>
.....content here
</meter>
HTML <meter> Tag Attributes
The <meter> tag supports both global and event attributes and some of the common attributes are given below.
| Attributes |
Description |
| form |
This attribute is used to specify the form to which <meter> tag belongs to |
| value |
This attribute is used to specify the current value of the meter. |
| low |
This attribute is used to specify the range that must be considered as low value. |
| high |
This attribute is used to specify the range that must be considered as high value. |
| optimum |
This attribute indicates the optimal value of the gauge |
| max |
This attribute is used to specify the maximum value of the range |
| min |
This attribute is used to specify the minimum value of the range. Default minimum value is 0 |
HTML <meter> Tag Basic Example
Here, we are with a basic example of <meter> tag to show its functionality:
Default CSS Settings for HTML <meter> Tag
None
Browser Support for HTML <meter> Tag
Following browsers support this attribute:
-
Firefox 6+
-
Google Chrome 8+
-
Safari 6+
-
Opera 11+
