CSS - Fehleingaben in Formularen mit CSS hervorheben
Werte zwischen 1 und 10 sind gültig.
<style>
input[ type="number"]:in-range {
background-color: rgba(0, 255, 0, 0.25);
}
input[ type="number"]:out-of-range {
background-color: rgba(255, 0, 0, 0.25);
outline: 1px solid red;
}
input[ type="number"]:in-range + label::after {
content: 'OK.';
color: green;
}
input[ type="number"]:out-of-range + label::after {
content: 'fehlerhaft!';
color: red;
}
</style>
<p>Werte zwischen 1 und 10 sind gültig.<br>
<input type="number" id="value1" name="value1" value="12" min="1" max="10" placeholder="1 bis 10">
<label for="value1">Ihre Eingabe ist </label>
</p>
Siehe auch: Fehleingaben in Formularen farbig hervorheben und JavaScript - Zahl in einem Eingabefeld mit dem Mausrad verändern
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<u> Unterstreichen (Physische Auszeichnung)
CSS - Navigation mit :target auf und zumachen