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...