
required : must be filled
minlength / maxlength : text minimum / maximum length, can be combined
min / max : number minimum / maximum
pattern : with a regular expression. only be used on <input> elements.
<input type="text" id="zip_code" name="zip_code"
pattern="(\d{5}([\-]\d{4})?)" required>
input:invalid {
border-color: red;
}
input:valid {
border-color: green;
}