:in-range制限範囲内の値がある要素に スタイルを適用する

:in-range 疑似クラスは、type="number" が指定された input 要素など、min 属性や max 属性によって値の範囲を指定されている要素に対して、入力された値がその範囲内にある場合にスタイルを適用します。

:in-rangeのサンプルソース

input:in-range {
  background-color: #f1f8e9;
}

input:out-of-range {
  background-color: #ffebee;
}

主要ブラウザの対応

IE11 ×
Edge(EdgeHTML)
Edge(Chromium)
Chrome
Firefox
Safari
iOS Safari
Android Chrome

用途から CSS プロパティやセレクタを探す

用途から CSS プロパティやセレクタを逆引きできます。

@-規則
メディアクエリ
セレクタ
疑似要素
疑似クラス
CSS関数
背景

対応ブラウザから CSS プロパティやセレクタを探す

対応ブラウザから CSS プロパティやセレクタを逆引きできます。

IE11
Edge(EdgeHTML)
Edge(Chromium)
Firefox
Chrome
Safari
iOS Safari
Android Chrome

このページの上部へ