step: HTML attribute

The step attribute is a number that specifies the granularity that the any value or keyword should adhere to. It is valid for inputs <input type="date">, <input type="month">, <input type="week">, <input type="time">, <input type="datetime-local" >, <input type="number"> and <input type="range">.

step sets the progress interval when you click the up and down spin buttons, move a slider left and right over a range, and validate different date types. If not explicitly included, the default value of step is 1 for number and range and 1 unit type (minute, week, month, day) for date/time input types. The value can be a positive number - integer or float - or the special value any, which means no switching is implied and any value is allowed (subject to other constraints, such as min and max).

The default feedrate value for number inputs is 1, allowing only integers to be entered unless the feedbase is an integer. The default step value for time is 1 second, with 900 equaling 15 minutes.

Syntaxt

Tipo di ingresso Valore Esempio
date 1 (giorno) <input type="date" min="2019-12-25" step="1">
month 1 (mese) <input type="month" min="2019-12" step="12">
week 1 (settimana) <input type="week" min="2019-W23" step="2">
time 60 (secondi) <input type="time" min="09:00" step="900">
datetime-local 1 (secondo) <input type="datetime-local" min="2019-12-25T19:30" step="7">
number 1 <input type="number" min="0" step="0.1" max="10">
range 1 <input type="range" min="0" step="2" max="10">

If any is not explicitly set, the valid values for the number, date/time, and range input types are the same as the base for the step: the min value and increments of the step value, up to the value max, if specified. For example, if we have <input type="number" min="10" step="2"> an even integer, 10 or greater, it is valid. If omitted, <input type="number">, any integer is valid, but floats, like 4.2, are invalid, since the default step value is 1. For 4.2 to be valid, step should have been set to any, 0.1, 0.2, or whatever minimum value would have been a number ending in .2, such as <input type="number" min="-5.2">.

Accessibility issues

Provide instructions to help users understand how to complete the form and use individual form controls. Indicate any mandatory and optional inputs, data formats and other relevant information. When using the min attribute, ensure that this minimum requirement is understood by the user. Providing instructions within <label> may be sufficient. If you provide instructions outside of labels, which allow for more flexible placement and design, consider using aria-labelledby or aria-describedby.