HTML <meter> 元素

HTML <meter> 元素表示已知范围内的标量值或小数值。

使用 <meter> 元素展示给定的数据范围：

<meter value="2" min="0" max="10">2（十分为满分）</meter><br>
<meter value="0.6">60%</meter>

尝试一下 »

特性

内容类别	流式内容，短语内容，Invalid param，可触知内容。
允许的内容	短语内容，但其后代中不能有 <meter> 元素。
标签省略	不允许，开始标签和结束标签都不能省略。
允许的父元素	任何接受短语内容的元素。
允许的 ARIA 角色	None
DOM 接口	HTMLMeterElement

属性

该元素包含了全局属性。

事件属性

<meter> 元素支持所有 HTML事件属性。

value

当前数值。如果指定了该属性，它必须在最小值和最大值之间（min 属性和 max 属性）。如果未指定或格式错误，则值为 0。如果指定，但不在 min 属性和 max 属性给定的范围内，则该值等于该范围的最接近的一端的值。

使用注意： 除非 value 属性在 0 和 1（包括）之间，否则 min 和 max 属性应该定义具体范围，以保证 value 属性的值在其中。（注：min 的默认值为 0， max 的默认值为 1）

min

数值范围的数字下限。如果指定，它必须小于最大值（max 属性）。如果未指定，最小值为 0。

max

数值范围的数字上限。如果指定，这必须大于最小值（ min 属性）。如果未指定，最大值为 1。

low

数值范围的低值区间的数字上限。其必须大于最小值（min 属性），并且还必须小于高值和最大值（分别为 high 属性和 max 属性，如果有的话）。如果未指定，或者如果小于最小值，则 low 值等于最小值。

high

数值范围的高值区间的数字下限。其必须小于最大值（max 属性），并且还必须大于低值和最小值（分别为 low 属性和 min 属性，如果有的话）。如果未指定，或者如果大于最大值，则 high 值等于最大值。

optimum

该属性表示最佳数值。它必须在范围内（由 min 属性和 max 属性定义）。当与 low 属性和 high 属性一起使用时，它会给出在该范围内被认为是更好的指示。例如，如果它在 min 属性和 low 属性之间，则认为较低的范围是首选。

form

该属性将元素与一个具有 meter 元素所有权的 form 元素相关联。例如，meter 可能用来显示与 type 为 number 的 input 元素相对应的范围。该属性仅在 meter 元素用作表单关联元素时使用; 即使如此，如果元素显示为 form 元素的后代，则可以省略该属性。

使用说明

<meter> 标签定义度量衡。仅用于已知最大和最小值的度量。比如：磁盘使用情况，查询结果的相关性等。

<meter> 不能作为一个进度条来使用， 进度条请使用 <progress> 元素。

更多实例

简单的例子

<p>将烤箱加热至 <meter min="200" max="500" value="350">350 度</meter>。</p>

<p>如果浏览器不支持，将显示完整文本：将烤箱加热至 350 度。</p>

尝试一下 »

高和低值范围的实例

请注意，在该示例中，min 属性被省略; 这是允许的，因为它默认为 0。

<p>他在考试中获得 <meter low="69" high="80" max="100" value="84">B</meter>。</p>

<p>如果浏览器不支持，将显示完整文本：他在考试中获得 B。</p>

尝试一下 »

规范

规范	状态	备注
HTML Living Standard <meter> 的定义	现行的标准	-
HTML5 <meter> 的定义	推荐	初始定义

HTML 4.01 与 HTML5 之间的差异

<meter> 是 HTML5 的新元素。

桌面浏览器兼容性

移动浏览器兼容性

Microsoft Edge 详细支持状态请参阅 Microsoft Edge 平台状态页面.

相关链接

• <progress>