<meter>

HTMLの<meter>タグを使うと、メーターを表示できる。

使い方

<meter value="0.8">
  0.8
</meter>

開始タグと終了タグの間の文字列は表示されない。

<meter> とほぼ同じ機能を持つタグとして、<progress> がある。

属性

<meter> タグには次の属性を指定できる。

value

現在の値を指定する。value属性の指定を省略した場合は0となる。

min

メーターが取り得る範囲の下限値を指定する。min属性の指定を省略した場合、下限値は0となる。

<meter value="3" min="1" max="5">
</meter>
max

メーターが取り得る範囲の上限値を指定する。max属性の指定を省略した場合、上限値は1となる。

high

メーターが取り得る範囲のうち、「高」と判断される下限値を指定する。現在値が「高」であれば、メーターの色が変わる。

<meter value="0.8" high="0.7">
</meter>
low

メーターが取り得る範囲のうち、「低」と判断される上限値を指定する。現在値が「低」であれば、メーターの色が変わる。

class

CSSのクラスを指定する。

id

一意な識別子を指定する。

style

CSSのプロパティを指定する。

<meter value="0.8" style="height:2rem;">
</meter>
title

メーターのタイトルを指定する。

<meter value="0.5" title="0.5">
</meter>

コンテンツモデル

meter要素は次のコンテンツモデルに属する。

HTMLタグ