HTML Tag Reference
meter 要素
特定の範囲にある数値を表す
meter 要素は特定の範囲にある数値を表します。例えばディスクの使用量や人口割合などを表すことが可能です。対応するブラウザでは、ゲージなど、直観的な形式で表示されます。
ただし、meter 要素は、進捗を表す （プログレスバーなど） ために使うべきではありません。進捗を表す要素として、別途 progress 要素が定義されています。また、値の範囲が明確でない数値を表すことはできません。例えば最大値が定められていない数値を表すためにこの要素を使用することは適切ではありません。
meter 要素の内容は、対応していない環境への代替コンテンツとなります。
meter 要素の仕様
- コンテンツモデル
-
ただし、meter 要素を子孫に持つことはできません
- この要素を使用できる文脈
フレージング・コンテンツが期待される場所
詳細説明
meter 要素に指定可能な属性とその値は下記の通りです。
| 属性値 | 概要 |
|---|---|
| value 属性（必須） | 値を指定します。指定した値が現在の数値になります。指定できる数値は浮動小数点数ですが、max 属性値以下、min 属性値以上でなければなりません。 |
| max 属性 | 値の最大値を指定します。指定できる数値は浮動小数点数ですが min 属性、および low 属性が指定されている場合はその値以上である必要があります。省略された場合の初期値は 「1」 です。 |
| min 属性 | 値の最大値を指定します。指定できる数値は浮動小数点数ですが max 属性、および high 属性が指定されている場合はその値以下である必要があります。省略された場合の初期値は 「0」 です。 |
| high 属性 | その数値が高いと判断される閾値を指定します。指定できる数値は浮動小数点数ですが max 属性値以下、かつ min 属性、および low 属性が指定されている場合はその値以上である必要があります。 |
| low 属性 | その数値が低いと判断される閾値を指定します。指定できる数値は浮動小数点数ですが min 属性値以上、かつ max 属性、および high 属性が指定されている場合はその値以下である必要があります。 |
| optimum 属性 | その数値が最適だと判断される数値を指定します。指定できる数値は浮動小数点数ですが max 属性値以下、min 属性値以上である必要があります。 |
指定する値は、下記の不等式が成り立つようにしなければなりません。
- min ≤ value ≤ max
- min ≤ low ≤ max （もし low 属性が指定されている場合）
- min ≤ high ≤ max （もし high 属性が指定されている場合）
- min ≤ optimum ≤ max （もし optimum 属性が指定されている場合）
- low ≤ high （もし low 属性と high 属性が同時に指定されている場合）
動作サンプル
対応するブラウザでは、メーターが表示されます。
ハードディスク使用率： 60%
meter 要素のサンプルソース
<p> 投票率： <meter value="67" min="0" max="100">67%</meter> </p>
<p> ハードディスク使用率： <meter value="60" min="0" max="100" law="20" height="80">60%</meter> </p>
主要ブラウザの対応
| IE11 | × |
|---|---|
| Edge（EdgeHTML） | ○ |
| Edge（Chromium） | ○ |
| Chrome | ○ |
| Firefox | ○ |
| Safari | ○ |
| iOS Safari | ○ |
| Android Chrome | ○ |