:out-of-range クラス

　:out-of-range クラスは、入力された値が min と max 属性の範囲外になると、設定されたスタイルを反映する CSS の擬似クラスです。主に min と max 属性をもつエレメント、<input> などが対象の疑似クラスです。

　関係する <label> も、"+label" セレクターでスタイルを設定することができます。

:out-of-range

input:out-of-range{
	outline: 2px red solid;
}

input:out-of-range + label{
	background-color: #FF000044;
}

詳しくは Example を参照してください

　対になる疑似クラスに :in-range クラスがあります。:in-range クラスはminとmax属性の値の範囲内ならスタイルを反映します。

- ad -

構文(Syntax)

HTMLElement:out-of-range {
  style_propaties;
}

　疑似クラスはDOM ( JavaScript )から操作できません。
　スタイルのみの操作は擬似クラスを利用したほうが簡易です。

　:out-of-range の例です。:in-rangeクラスも使っています。範囲外になるとアラートが出ます。