Hurry! Try our new Interactive Courses for FREE. 🥳   🚀
  Signup/Sign In

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+