In traditional HTML, there are only a few options for entering numbers in a form:
if the expected range of possible numbers entered is high (say 1 – 100), use an
<input type=text />and try to validate the entry.
If the range is moderate (1 – 12), use a drop-down menu with pre-assigned options.
If the range is low (0 – 2) use radio buttons.
Let’s start with the simplest of these: the number input.
Nothing could be simpler: a compatible browser or device will understand that a number should be entered into the field, and (ideally) limit user input to numerals. However, there are many more features in the
number element to consider.
Sometimes a form question is phrased in such a way that a slider is the best interface choice:
<input type=range name=slider id=slider min=0 max=10 value=5>
Takes a telephone number as an input.
<label for=phone accesskey=p>Phone number:</label>
<input name=phone id=phone type=tel maxlength=11 size=13>
Related input types are: