Pseudoclasa out-of-range

Pseudoclasa out-of-range definește stilul elementelor ale căror valori depășesc intervalul specificat. Intervalul de valori trebuie să fie specificat de atributele min și max.

Sintaxă

cssselector:out-of-range {
  
}

Exemplu

Să setăm o culoare albastră pentru fundalul inputului în care sunt introduse numerele care se încadrează în intervalul de la 1 la 5. De asemenea, să setăm un fundal roz, atunci când valoarea introdusă nu se încadrează în limitele alese:

html<form>
  <p>Introduceți un număr de la 1 la 5</p>
  <p>
    <input type="number" min="1" max="5" value="1">
  </p>
</form>
cssinput:in-range {
  background: #C2DDFD;
}
input:out-of-range {
  background: #E37D76;
}

Результат:

Vedeți și

  • pseudoclasa :in-range,
    care definește stilul elementelor cu un interval de valori specificat
  • pseudoclasa :invalid,
    care definește stilul inputului în care a fost introdusă o valoare incorectă
  • pseudoclasa :valid,
    care definește stilul inputului în care a fost introdusă o valoare corectă