Pseudo-klas out-of-range

Die pseudo-klas out-of-range styliseer elemente waarvan die waardes buite die gespesifiseerde omvang val. Die omvang van waardes moet gespesifiseer word met die attribure min en max.

Sintaksis

cssselektor:out-of-range {
  
}

Voorbeeld

Kom ons stel 'n ligblou agtergrondkleur in vir die invoerveld waar getalle wat binne die omvang van 1 tot 5 ingevoer word. Ons sal ook 'n pienk agtergrond instel wanneer die ingevoerde waarde nie binne die gekose perke val nie:

html<form>
  <p>Voer 'n nommer van 1 tot 5 in</p>
  <p>
    <input type="number" min="1" max="5" value="1">
  </p>
</form>
cssinput:in-range {
  background: #C2DDFD;
}
input:out-of-range {
  background: #E37D76;
}

Результат:

Sien ook

  • die pseudo-klas :in-range,
    wat elemente met 'n gespesifiseerde waarde-omvang styliseer
  • die pseudo-klas :invalid,
    wat die invoerveld styliseer waar 'n verkeerde waarde ingevoer is
  • die pseudo-klas :valid,
    wat die invoerveld styliseer waar 'n korrekte waarde ingevoer is