The :in-range
pemilih pseudo dalam CSS perlawanan elemen input apabila nilai mereka adalah dalam julat yang ditetapkan sebagai boleh diterima. Ini adalah sebahagian daripada spesifikasi CSS Selectors Level 4 yang kini ada dalam Draf Editor.
input:in-range ( border: 5px solid green; )
Saya percaya ia hanya relevan pada input(type=number)
. Input julat tidak membenarkan nilai di luar min / maxnya dan tidak masuk akal pada jenis input lain. Mungkin input teks-y dengan panjang maksimum, tetapi tingkah laku yang ada pada kebanyakan penyemak imbas adalah untuk mengelakkan kemasukan melebihi nilai maksimum.
Demo
Sama seperti kod di atas, input ini akan mempunyai sempadan hijau apabila nilainya antara 5 dan 10.
Sokongan penyemak imbas
Data sokongan penyemak imbas ini berasal dari Caniuse, yang mempunyai lebih terperinci. Nombor menunjukkan bahawa penyemak imbas menyokong ciri pada versi dan ke atas.
Desktop
Chrome | Firefox | IE | Hujung | Safari |
---|---|---|---|---|
53 | 50 | Tidak | 79 | 10.1 |
Mudah Alih / Tablet
Android Chrome | Android Firefox | Android | Safari iOS |
---|---|---|---|
88 | 85 | 81 | 10.3 |
Harta yang berkaitan
Almanak pada 1 Jul 2020:luar kawasan
input:out-of-range ( border: 5px solid red; )




