HTML5 now allows users to select among a range of numbers. If, for instance, you want your viewers to make a purchase, you'll probably want them to use whole numbers. After all, who orders 2 ½ shoes?
If we continue the shoe-buying example, we could develop a form like this:
<form> <label>How many shoes would you like to purchase?<label> <input type="number" name="quantity" min="2" max="6" step="2" value="2" size="4" /> </form>
Notice that in the input
, we have optionally specified a minimum number that can be ordered (2) and a maximum that can be ordered (6). Step
allows us in this case to make sure users can only order shoes in pairs while value
sets the initial number of items displayed. Size
then controls how wide the input
box will be.