HTML5 number input type examples




HTML5 number input type examples

<!DOCTYPE html>
<html>
   <head>
      <title>HTML5 number input type examples</title>
      <style type="text/css">
         input[type="number"]:valid {
            outline: 2px solid yellow;
         }
         input[type="number"]:invalid {
            outline: 2px solid red;
         }
      </style>
   </head>
   <body>
      <form>
         <label>
            Select Number: <input type="number" value="1" 
            min="1" max="10" step="0.5" name="mynumber">
         </label>
      </form>
      <p><strong>Note</strong>: If you try to enter
      the number out of the range (1-10).</p>
   </body>
</html>

Output