HTML5

：

タグ（要素）

：

METER

　 編集：2022.06.27 by T.A.

→● mdn

ゲージを表す。

この要素を使用できる文脈

フレージング内容が期待される場所。

内容モデル

フレージング内容、ただし METER 要素子孫が存在してはならない。

text/htmlにおけるタグ省略

どちらのタグも省略不可。

内容属性
解説

既知の範囲内でスカラー量、または小数の値を表す。たとえば、ディスク使用量、クエリー結果の関連性、または特定の候補を選択するための投票人口の割合などである。

これはまた、ゲージとして知られる。

METER 要素は、（進捗バーのように）進行状況を示すために使用すべきでない。その役割に対して、HTML は独立して PROGRESS 要素を提供する。

例

次の例は、すべて 3/4 で満たされる 3 つのゲージを示す： 

Storage space usage: <METER value=6 max=8>6 blocks used (out of 8 total)</METER>
Voter turnout: <METER value=0.75><IMG alt="75%" src="graph75.png"></METER>
Tickets sold: <METER min="0" max="100" value="75"></METER>
value属性

要素の現在値。

"測定された" 値として示すゲージを持つ値を指定する。

<METER value=0.5></METER>

min属性

範囲の下限を指定する。

<METER id=IdminMeter min=0.3></METER><BR>
<INPUT type=number oninput="IdminMeter.value=this.value" value=0 step=0.1>


<METER id=Idmin2Meter min=-0.3></METER><BR>
<INPUT type=number oninput="Idmin2Meter.value=this.value" value=0 step=0.1>

max属性

範囲の上限を指定する。

<METER id=IdmaxMeter max=10></METER><BR>
<INPUT type=number oninput="IdmaxMeter.value=this.value" value=0 step=1>

low属性

“低”部分であると考えられる範囲を指定する。

<METER id=IdlowMeter min=0 max=10 low=3></METER><BR>
<INPUT type=number oninput="IdlowMeter.value=this.value" value=0 step=1>

high属性

“高”部分であると考えられる範囲を指定する。

<METER id=IdhighMeter min=0 max=10 high=7></METER><BR>
<INPUT type=number oninput="IdhighMeter.value=this.value" value=0 step=1>

optimum属性

“最適”である位置を与える。それが“高”値より高い場合、より高い値がより良いことを示し、それが“低”マークよりも低い場合、より低い値がより良いことを示す。自然に間にある場合、高くも低くもない値が良いことを示す。

<METER id=IdoptimumMeter min=0 max=10 optimum=5></METER><BR>
<INPUT type=number oninput="IdoptimumMeter.value=this.value" value=0 step=1>


<METER id=Idoptimum2Meter min=0 max=10 low=2 high=8 optimum=5></METER><BR>
<INPUT type=number oninput="Idoptimum2Meter.value=this.value" value=0 step=1>

form属性

FORM 要素と関連付ける。この属性の値は同じ文書内の FORM要素 の id である必要があります。

この属性が設定されていなかった場合、その METER要素の祖先に FORM要素があれば、それに関連付けられます。 

<FORM id=IdformForm action="○○.cgi" method=post target=Test style="border:1px solid black;">
 <METER name=Meter form=IdformForm id=IdformMeter min=0 max=10 low=2></METER><BR>
 <INPUT type=number oninput="IdformMeter.value=this.value" value=0 step=1><BR>
 <BUTTON type=submit>送信</BUTTON>
</FORM>
¶送信すると、サーバーCGIはデータ「Meter=＊」を受け取る？

テスト
HTML：

ここに表示
HTML：

ここに表示
スクリプト：


スクリプト：



表示内容：
表示内容：