To set a selection range, you can use the
input
add to the element
type="range"
and use the
.form-range
class:
Select range:
By default, the step size is 1, which can be passed through the By default, the minimum value is 0 and the maximum value is 100, which can be set through the min or max attribute:
7.34.1. Example ¶
<label for="customRange" class="form-label">Custom range</label>
<input type="range" class="form-range" id="customRange">
Step size ¶
step
property to set: 7.34.2. Example ¶
<input type="range" class="form-range" step="10">
Maximum and minimum value ¶
7.34.3. Example ¶
<input type="range" class="form-range" min="0" max="4">