The step attribute can be applied to form input elements that define a numeric range of possible values, such as type=”time” or type=”range”. Applying the step attribute causes the associated input control’s values to snap to the granularity specified by the attribute value.

In the case of a range slider, the slide grip will snap to a set of intervals defined by the step attribute with respect to the values of the min and max attributes.

In the case of a text field containing a time or numeric value, the increment and decrement buttons within the field will cause the value to increase or decrease by the associated step value.

The interval to which the step attribute value aligns is defined by using the min attribute (if specified) as the base value in the acceptable range of values.

For relevant input controls, if the step attribute is omitted, the value any is default, and indicates that there is no limit on the granularity of the entered value, other than the precision of the underlying data type.

Syntax:

<input type="number" min="5" max="100" step="5" />

<input type="time" step="any" />

Elements:

Example

Example with the step attribute:

 

›› go to examples ››