:in-range 疑似クラス CSS プロパティとは
トピック:範囲内セレクタは、指定された範囲内の値を持つすべての要素を選択する ことができる CSS の :in-range疑似クラスは、現在の値が min および max 属性による制限範囲内にある <input> 要素を表する
疑似クラス セレクター :in-range
実例 コード 1
サンプル コードを試すinput:in-range {
border: 2px solid red;
}
情報:- この擬似クラスは、入力フィールドの現在の値が許可された許容範囲内にあることをユーザーに視覚的に示すことができる。
:out-of-range セレクタを使用して、指定した範囲外の値を持つすべての要素を選択する ことができる。
使用上の注意::in-rangeセレクタは、最小および最大の属性を持つ入力要素など、範囲の制限がある要素に対してのみ機能する ことができる。
構文
:in-range { css : properties ; }
疑似クラス名 {スタイル要素のプロパティ : プロパティ値; }
サポートするデスクトップ ブラウザ対応・互換性
| Property | Desktop 互換性 |
|---|
| :in-range | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|
| 基本 サポート | フルサポート◯10 | フルサポート◯あり | フルサポート◯29 | サポートなし✖ | フルサポート◯11 | フルサポート◯あり |
|---|
サポートするモバイル ブラウザ対応・互換性
| Property | Mobile 互換性 |
|---|
| :in-range | Android | Chrome for Android
| Edge Mobile | Firefox for Android
| Opera for Android
| iOS Safari | Samsung Internet |
|---|
| 基本 サポート | フルサポート◯2.3 | 不明 | フルサポート◯あり | フルサポート◯16 | フルサポート◯あり | フルサポート◯あり | 不明 |
|---|
CSS :in-range 疑似クラス | CSS プロパティ 値| 意味 使い方 実例 – WebRef