Pseudoklasse out-of-range

Die Pseudoklasse out-of-range definiert den Stil für Elemente, deren Werte außerhalb des angegebenen Bereichs liegen. Der Wertebereich muss durch die Attribute min und max festgelegt werden.

Syntax

cssSelektor:out-of-range {
  
}

Beispiel

Lassen Sie uns eine hellblaue Hintergrundfarbe für eine Eingabe festlegen, in die Zahlen eingegeben werden, die in den Bereich von 1 bis 5 fallen. Wir legen auch einen rosafarbenen Hintergrund fest, wenn der eingegebene Wert nicht in die gewählten Grenzen fällt:

html<form>
  <p>Geben Sie eine Zahl von 1 bis 5 ein</p>
  <p>
    <input type="number" min="1" max="5" value="1">
  </p>
</form>

cssinput:in-range {
  background: #C2DDFD;
}
input:out-of-range {
  background: #E37D76;
}

Результат:

Siehe auch