The :in-rangesemu pemilih di CSS cocok elemen masukan ketika nilai mereka dalam kisaran tertentu sebagai diterima. Ini adalah bagian dari spesifikasi CSS Selectors Level 4 yang saat ini ada di Editor's Draft.
input:in-range ( border: 5px solid green; )Saya yakin ini hanya relevan di input(type=number). Input rentang tidak mengizinkan nilai di luar min / maks dan tidak masuk akal pada jenis input lainnya. Mungkin input teks-y dengan panjang maksimum, tetapi perilaku pada sebagian besar browser adalah untuk mencegah entri melewati batas maksimum.
Demo
Sama seperti kode di atas, input ini akan memiliki garis tepi hijau jika nilainya antara 5 dan 10.
Dukungan browser
Data dukungan browser ini berasal dari Caniuse, yang lebih detail. Angka menunjukkan bahwa browser mendukung fitur pada versi tersebut dan yang lebih baru.
Desktop
| Chrome | Firefox | YAITU | Tepi | Safari |
|---|---|---|---|---|
| 53 | 50 | Tidak | 79 | 10.1 |
Ponsel / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 10.3 |
Properti terkait
Almanac pada 1 Juli 2020:diluar jangkauan
input:out-of-range ( border: 5px solid red; ) 
Geoff Graham