max属性
meter要素のmax属性は、計測範囲の最大値を指定する属性。HTML5にて新たに導入された属性である。
ブラウザ対応 |
---|
構文
<meter value="実際値" max="最大値"></meter>
max属性には、計測範囲の最大値を指定する。
max属性の初期設定値は、0
である。
min属性は指定しない場合
<meter value="0~最大値" max="最大値"></meter>
min属性を指定しない場合、max属性には、min属性の初期設定値である0
より大きい数値を指定する。value属性には、min属性の初期設定値である0
から、max属性に指定した最大値まで範囲の、数値(浮動小数点数)を指定する。
min属性も指定する場合
<meter value="最小値~最大値" min="最小値" max="最大値"></meter>
min属性を指定した場合、max属性には、min属性に指定した最小値より大きい数値を指定する。value属性には、min属性に指定した最小値から、max属性に指定した最大値まで範囲の、数値を指定する。
サンプルコード
最大値を設定
<meter value="0.5" max="0.3">0.5</meter>
最小値と最大値を設定
<meter value="50" min="0" max="100">50/100</meter>
サンプル
HTMLソースコード
<p> 0.3~1の範囲(実際値は0.5): <meter value="0.5" max="2.0">0.5</meter> </p> <p> 0.4~1の範囲(実際値は0.5): <meter value="0.5" max="1.0">0.5</meter> </p> <p> 0.5~1の範囲(実際値は0.5): <meter value="0.5" max="0.5">0.5</meter> </p> <p> 0~500の範囲(実際値は250): <meter value="250" min="0" max="500">250/500</meter> </p> <p> 0~400の範囲(実際値は250): <meter value="250" min="0" max="400">250/400</meter> </p> <p> 0~300の範囲(実際値は250): <meter value="250" min="0" max="300">250/300</meter> </p> <p> 0~250の範囲(実際値は250): <meter value="250" min="0" max="250">250/250</meter> </p>
実際の表示
0.3~1の範囲(実際値は0.5):
0.4~1の範囲(実際値は0.5):
0.5~1の範囲(実際値は0.5):
0~500の範囲(実際値は250):
0~400の範囲(実際値は250):
0~300の範囲(実際値は250):
0~250の範囲(実際値は250):