: buiten bereik - CSS-trucs

Anonim

De :out-of-rangepseudo-selector in CSS komt overeen met invoerelementen als hun waarde buiten het bereik valt dat als acceptabel is opgegeven.

input:out-of-range ( border: 5px solid red; )

Ik geloof dat het alleen relevant is bij invoer (type = nummer). Bereikinputs staan ​​geen waarden buiten hun min / max toe en het heeft niet veel zin voor andere soorten input. Misschien tekst-y-invoer met een maxlength, maar het gedrag van die in de meeste browsers is om toch te voorkomen dat invoer voorbij de max.

Demo

Net als de bovenstaande code, heeft deze invoer een groene rand wanneer de waarde tussen 5 en 10 ligt.

Meer informatie

  • De Spec
  • :binnen bereik

Browser-ondersteuning

Chrome Safari Firefox Opera D.W.Z Android iOS
10+ 5.2+ 19- 11+ 10- 2.3+ 4+