Pseudoklasa CSS :in-range wybiera elementy input, które mają określony przedział dopuszczalnych wartości i ich obecna wartość mieści się w tym przedziale. Inaczej mówiąc, pseudoklasa ta wybiera elementy input, których wartość mieści się w przedziale określanym przez atrybut min, przez atrybut max lub przez oba te atrybuty jednocześnie.
Odwrotnością pseudoklasy :in-range jest pseudoklasa :out-of-range.
Przykład
W poniższym przykładzie dopuszczalny przedział wartości elementu input to 10-20:
<style>
:in-range {background-color: lightgreen}
</style>
...
<input type="number" name="zakres" min="10" max="20" value="15">Jeśli w elemencie tym użytkownik wpisze liczbę 15, która mieści się w dopuszczalnym przedziale wartości, to pseudoklasa :in-range zmieni jego kolor tła na zielony, jak widać na poniższym zrzucie ekranu.
Składnia
Składnia pseudoklasy :in-range:
:in-range {...}