HTML5 <meter> Tag
Last Updated :
28 Dec, 2023
The HTML <meter> form Attribute defines the scale for measurement in a well-defined range and supports a fractional value. It is also known as a gauge. It is used in Disk use, relevance query results, etc.Â
Avoid using the <meter> tag to denote progress, such as in a progress bar. Instead, utilize the <progress> tag specifically for progress bars. It allows you to specify a range, optimum, minimum, and maximum values for the meter.Â
Note: It’s highly recommended to incorporate the <label> tag for optimal accessibility practices!
Syntax:Â
<meter attributes...> </meter>
Attributes
| form |
Defines one or more forms to which the <meter> tag belongs. |
| max |
Specifies the maximum value of a range. |
| min |
Specifies the minimum value of a range. |
| high |
Specifies the range considered to be a high value. |
| low |
Specifies the range value that is considered to be low. |
| Optimum |
Specifies the optimum value for the range. |
| value |
Specifies the required or actual value of the range. |
Example:Â In this example, we will see the implementation of the meter tag with an example.
html
<!DOCTYPE html>
<html>
<body>
<h1>
GeeksforGeeks
</h1>
<p>
Meter Tag:
</p>
Sachin's score:
<meter value="5" min="0" max="10">
5 out of 10
</meter>
<br>
Laxma sxore:
<meter value="0.5">
50% from 100%
</meter>
</body>
</html>
|
Output:Â
Supported Browsers:Â
- Google Chrome 6
- Edge 18
- Firefox 16
- Opera 11
- Safari 6
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...