Pseudotřída out-of-range

Pseudotřída out-of-range nastavuje styl prvkům, jejichž hodnoty jsou mimo stanovený rozsah. Rozsah hodnot musí být zadán atributy min a max.

Syntaxe

cssselektor:out-of-range {
  
}

Příklad

Nastavme modrou barvu pozadí pro input, do kterého se zadávají čísla spadající do rozsahu od 1 do 5. Také nastavme růžové pozadí, když zadaná hodnota nespadá do zvoleného rozsahu:

html<form>
  <p>Zadejte číslo od 1 do 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;
}

Результат:

Viz také

  • pseudotřída :in-range,
    která nastavuje styl prvkům s daným rozsahem hodnot
  • pseudotřída :invalid,
    která nastavuje styl inputu, do kterého bylo zadáno nesprávnou hodnotu
  • pseudotřída :valid,
    která nastavuje styl inputu, do kterého bylo zadáno správnou hodnotu