HTML - meter 要素

概要

名前
meter
カテゴリー
  • Flow content
  • Phrasing content
  • Palpable content
  • Labelable element
配置できる場所
Phrasing content が期待される場所。
コンテンツモデル
Phrasing content。ただし、別の meter 要素の先祖になってはいけない。
説明
meter 要素は、あらかじめ分かっている特定の範囲内における量、または割合を表す要素です。例えば、ハードディスクなどの使用状況を示す場合や、選挙の投票率を示す場合などに使用されます。meter 要素に未対応のブラウザでもメーターの示す量や割合がわかるようにするために、要素内容としてメーターの示す値をテキストで含めることが推奨されています。
タグの省略
開始タグも終了タグも省略できません。
DOM Interface
HTMLMeterElement
仕様書
仕様書策定状況コメント
LS:現行の標準
REC:勧告
サポートブラウザ
ie
IE
edge
Edge
firefox
Firefox
chrome
Chrome
safari
Safari
opera
Opera
safari
iOS Safari
android
Android
×16661110.3×
○:Support ×:Not Support ?:未定義 n:以降の Version で Support

属性

属性サポートブラウザ
属性名 ie
IE
edge
Edge
firefox
Firefox
chrome
Chrome
safari
Safari
opera
Opera
safari
iOS Safari
android
Android
form×16661110.3×
high×16661110.3×
low×16661110.3×
max×16661110.3×
min×16661110.3×
optimum×16661110.3×
value×16661110.3×
○:Support ×:Not Support ?:未定義 n:以降の Version で Support
グローバル属性
すべての要素で共通に利用できるグローバル属性を指定できます。
form
meter 要素の属するフォームの id を指定します。例えばフォームの input 要素の範囲を表す用途で meter 要素を用いている場合、このフォームの id を指定します。対象がフォーム関連要素である場合にのみこの属性を使用可能です。meter 要素が関連するフォームの子孫要素として配置されているのなら、そのメーターは自動的にそのフォームに属するものとなり、この属性は省略可能です。
high
「高」とされる範囲全体の下限値。属性値は、max 属性の値より小さく、かつ low 属性や min 属性の値より大きいものでなくてはなりません。high 属性が未定義、もしくはその値が max 属性の値より大きい場合、high の値は最大値と同じです。
low
「低」とされる範囲全体の上限値。属性値は、min 属性の値より大きく、かつ high 属性、および max 属性の値より小さいものでなくてはなりません。low が未定義、もしくはその値が min 属性の値より小さい場合、low の値は最小値と同じです。
max
範囲全体の上限。min 属性により下限が設定されている場合は、それより大きい値でなくてはなりません。未設定の場合、上限値は 1 となります。
min
範囲全体の下限。max 属性により上限が設定されている場合は、それより小さい値でなくてはなりません。未設定の場合、下限値は 0 となります。
optimum
最適な数値の範囲を表します。min 属性と max 属性によって定義される範囲内の値でなくてはなりません。low 属性と high 属性が指定されている場合、この属性の値を含む範囲が最適な数値の範囲とみなされます。例えば optinum 属性の値が min 属性と low 属性の間のいずれかである場合、「低」の範囲が最適な数値となります。
value
現在の数値。min 属性と max 属性が指定されている場合、これらの表す範囲内に収まる値でなくてはなりません。この value 属性が未定義、あるいは不正な値であった場合は、その値は 0 となります。指定されている値が min 属性と max 属性が示す範囲の範囲外の値である場合、その範囲の内のもっとも近い値が適用されます。value 属性の値が 0 を下限、1 を上限とするものでない限り、min 属性および max 属性で value 属性の下限および上限を定義しなくてはなりません。

サンプルコード

meter 要素のサンプルコードは以下のとおりです。

<p>
オーブンの温度: <meter min="200" max="500" value="350"> 350 degrees </meter>
</p>
meter 要素のサンプルコード

関連記事

Category:
プログラミング
公開日:
更新日:
Pageviews:
10
Shares:
0
Tag:
HTML