Werner-Zenk.de - Zur Startseite

CSS - Fehleingaben in Formularen mit CSS hervorheben


<style>

li {
  list-
stylenone;
  
margin-bottom1em;
}

input {
  
border1px solid black;
}

input:in-range {
  
background-colorrgba(025500.25);
}

input:out-of-range {
  
background-colorrgba(255000.25);
  
border2px solid red;
}

input:in-range label::after {
  
content'OK.';
}

input:out-of-range label::after {
  
content'fehlerhaft!';
}
</
style>


<
form  id="form1">
  <
ul>Werte zwischen 1 und 10 sind gültig.
    <
li>
      <
input id="value1" name="value1" type="number" placeholder="1 to 10" min="1" max="10" value="12">
      <
label for="value1">Ihre Eingabe ist </label>
    </
li>
  </
ul>
</
form>

Bausteine

Eine zufällige Auswahl von „Bausteinen” aus den Bereichen CSS, PHP, JavaScript und MySQL.

CSS - Wertigkeiten verändern mit der !important-Regel

PHP - Datum und Uhrzeit formatiert ausgeben

JavaScript - Sekundenzähler

MySQL - Eintrag überschreiben