The HTML <meter> tag

Definition and usage

<meter> tag defines a scalar measurement value within a known range, or a fractional value. Also known as a gauge (gauge).

For example: disk usage, relevance of query results, etc.

Note:should not be used <meter> to represent progress (such as progress bars). For progress bars, use <progress> tag.

Tip:Always use <label> tagfor the best accessibility practices!

See also:

HTML DOM Reference Manual:Meter object

Example

Use the meter element to display a scalar value within a given range (gauge):

<label for="disk_c">Disk usage C：</label>
<meter id="disk_c" value="2" min="0" max="10">Two-tenths</meter><br>
<label for="disk_d">Disk usage D:</label>
<meter id="disk_d" value="0.6">60%</meter>

Try it yourself

Attribute

Attribute Value Description
form Form id Specifies which form the <meter> element belongs to.
high Number Specifies the high value of the range.
low Number Specifies the low value of the range.
max Number Specifies the maximum value of the range.
min Number Specifies the minimum value of the range. The default value is 0.
optimum Number Specifies the optimal value of the gauge.
value Number Required. Specifies the current value of the gauge.

Description

The meter element displays one of all possible values within a certain range.min and max The attribute sets the boundaries of the possible value range, which can be represented by floating-point numbers. The display of the meter element can be divided into three parts: too low, too high, and optimal.low The attribute sets a value, and all values below it are considered to be too low;high The attribute sets a value, all values above it are considered to be too high;optimum The attribute specifies the optimal value.

Global Attributes

<meter> The tag also supports Global Attributes in HTML.

Event Attributes

<meter> The tag also supports Event Attributes in HTML.

Default CSS Settings

None.

Browser Support

The numbers in the table indicate the first browser version to fully support this tag.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
8.0 13.0 16.0 6.0 11.5