Pseudoklasse in-range
Pseudoklassen in-range setter stil
for elementer hvis verdier er angitt
innenfor et bestemt område. Verdiområdet
må være angitt med attributtene min
og max.
Syntaks
velger:in-range {
}
Eksempel
La oss sette lyseblå farge for bakgrunnen til input-feltet der
det skrives inn tall som faller innenfor området
fra 1 til 5. Vi setter også rosa bakgrunn når
den innskrevne verdien ikke faller innenfor det valgte
intervallet:
<form>
<p>Skriv inn tall fra 1 til 5</p>
<p>
<input type="number" min="1" max="5" value="1">
</p>
</form>
input:in-range {
background: #C2DDFD;
}
input:out-of-range {
background: #E37D76;
}
:
Se også
-
pseudoklassen
:out-of-range,
som setter stil for elementer hvis verdier går utenfor området -
pseudoklassen
:valid,
som setter stil for input-felt der riktig verdi er skrevet inn -
pseudoklassen
:invalid,
som setter stil for input-felt der feil verdi er skrevet inn