HTML 属性: min

min 属性は、その属性を含む入力欄に対して許容できる有効な最小値を定義します。要素のがこれより大きい場合、その要素は制約検証に失敗します。この値は、 max 属性の値以下でなければなりません。 min 属性が指定されていないか無効であった場合、最小値は適用されません。

これは数値入力型、例えば date, month, week, time, datetime-local, number, range 型や <meter> 要素で有効であり、 min 属性はフォームコントロールで妥当と見なされる最も小さな値を指定する数値です。

構文

min の構文 (入力 type 別)
入力型 構文
date yyyy-mm-dd <input type="date" min="2019-12-25" step="1">
month yyyy-mm <input type="month" min="2019-12" step="12">
week yyyy-W## <input type="week" min="2019-W23" step="">
time hh:mm <input type="time" min="09:00" step="900">
datetime-local yyyy-mm-ddThh:mm <input type="datetime-local" min="2019-12-25T19:30">
number <number> <input type="number" min="0" step="5" max="100">
range <number> <input type="range" min="60" step="5" max="100">

注: ユーザーが入力したデータが設定された最大値を満たしていない場合、制約検証では無効とみなされ、 :invalid の擬似クラスに一致するようになります。

詳しくは クライアント側検証rangeUnderflow (en-US) を参照してください。

<meter> 要素における min 属性は、測定範囲の上限の数値を定義します。これは、指定されている場合、最大値 (max 属性) よりもチイサクなければなりません。どちらの場合も、省略された場合、値は既定で 1 となります。

その他の要素における min 値の構文
入力型 構文
<meter> <number> <meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="40"> at 40/100</meter>

step への影響

minstep の値は、 step 属性がない場合も含め、どの値が有効であるかを定義します。 step の既定値は 0 です。

無効な入力の周囲に太く赤い境界を追加します。

input:invalid {
  border: solid red 3px;
}

それから入力欄の最小値を 7.2 と定義し、 step 属性は省略しているので、既定値が 1 になります。

<input id="myNumber" name="myNumber" type="number" min="7.2" value="8">

step の既定値は 1 なので、有効な値は 7.2, 8.2, 9.2, などになります。 8 の値は有効ではありません。無効な値が入っているので、対応しているブラウザーは値が無効であることを表示します。

明示的に含まれていない限り、 numberrange では step は既定値の 1 となり、 date/time 入力型では 1 単位 (秒, 週, 月, 日) となります。

アクセシビリティの考慮

ユーザーがフォームに記入したり、個々のフォームコントロールを使用するのに役立つ説明を提供してください。必須の入力、任意の入力、データの書式、その他の関連する情報を示してください。 max 属性を使用する場合は、この最大値の要件がユーザーに理解されていることを確認してください。 <label> 内で指示を提供すれば十分かもしれません。ラベルの外に指示を提供すれば、より柔軟な配置やデザインが可能になるので、 aria-labelledby または aria-describedby を使用することを検討してください。

仕様書

仕様書 状態 備考
HTML Living Standard
min attribute の定義
現行の標準
HTML5
min attribute の定義
勧告

ブラウザーの互換性

No compatibility data found for html.elements.attributes.min.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.

関連情報