mozilla
Your Search Results

    meter 要素

    概要

    HTML の メーター要素 (<meter>) は、既知の範囲内のスカラー値、または小数値を表します。

    使用上の注意: value 属性の値が 0 を下限、1 を上限とするものでない限り、min 属性及び max 属性で value 属性の下限及び上限を定義しなくてはなりません。

    【訳注: この要素は、例えばディスクの使用状況や、選挙における全投票数中の特定の候補者の得票数など、その範囲が明確な文脈内でのみ使用可能です。つまり、身長や体重・貯金額・降雨量・サッカーの得点など、範囲の曖昧な量や個数に対して用いる事は不適切であるという事です。また、進捗率を表すにはこの要素でなく progress 要素が適しています。】

    属性

    他の全ての要素と同様に、この要素はグローバル属性を持ちます。

    value
    現在の数値。 min 属性と max 属性が指定されている場合、これらの表す範囲内に収まる値でなくてはなりません。この value 属性が未定義、あるいは不正な値であった場合は、その値は "0" となります。指定されているが min 属性と max 属性が示す範囲の範囲外の値である場合、その範囲の内の最も近い値が適用されます。
    min
    範囲全体の下限。 max 属性により上限が設定されている場合は、それより小さい値でなくてはなりません。未設定の場合、下限値は 0 となります。
    max
    範囲全体の上限。 min 属性により下限が設定されている場合は、それより大きい値でなくてはなりません。未設定の場合、上限値は 1 となります。
    low
    「低」とされる範囲全体の上限値。属性値は、min 属性の値より大きく、且つ high 属性及び max 属性の値より小さいものでなくてはなりません(※これらが定義されている場合)。low が未定義、もしくはその値が min 属性の値より小さい場合、メーターの 「低」とされる範囲全体の上限min 属性の値と同じものとなります。
    high
    「高」とされる範囲全体の下限値。属性値は、max 属性の値より小さく、且つ low 属性や min 属性の値より大きいものでなくてはなりません(※これらが定義されている場合)。high 属性が未定義、もしくはその値が max 属性の値より大きい場合、「高」とされる範囲全体の下限max 属性の値と同じものとなります。
    optimum
    最適な数値の範囲を表します。min 属性と max 属性によって定義される範囲内の値でなくてはなりません。low 属性と high 属性が指定されている場合、それらの何れかの中の、最適な数値の範囲と見做されます。例えば optinum 属性の値が min 属性と low 属性の間の何れかの値である場合、min 以上且つ optinum 以下の範囲が最適な数値となります。
    form
    meter 要素の属するフォーム (form owner) の id を指定します。例えばフォームの input 要素 (<input type="number" />) の範囲を表す用途で meter 要素を用いている場合、このフォームの id を指定します。対象がフォーム関連要素である場合にのみこの属性を使用可能です。meter 要素が関連するフォームの子孫要素として配置されているのなら、そのメーターは自動的にそのフォームに属するものとなり、この属性は省略可能です。

    シンプルな例

    <p>オーブンの温度: <meter min="200" max="500" value="350">350 degrees</meter></p>

    Google Chrome での表示結果は以下の様になります。

    meter1.png

    「高」の範囲と「低」の範囲の使用例

    この例では、min 属性が省略されています。よって、下限値は 0 となっています。

    <p>山田太郎くんの期末試験の点数: <meter low="69" high="80" max="100" value="84">B</meter></p>

    Google Chrome での表示結果は以下の様になります。山田くんは赤点です。

    meter2.png

    仕様

    仕様書 策定状況 コメント
    WHATWG HTML Living Standard Living Standard  
    HTML5 勧告候補  

    ブラウザ実装状況

    機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
    基本サポート 6.0 16.0 (16.0) バグ 555985 未サポート 11.0 5.2
    機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    基本サポート 未サポート 16.0 (16.0) バグ 555985 未サポート 11.0 未サポート

    関連情報

    ドキュメントのタグと貢献者

    Contributors to this page: ethertank, yyss
    最終更新者: yyss,