Bootstrap 5 范围

自定义范围

如需设置范围菜单的样式,请将 .form-range 类添加到 type="range" 的 input 元素:

自定义范围:

实例

<label for="customRange" class="form-label">自定义范围</label>
<input type="range" class="form-range" id="customRange">

亲自试一试

步进

默认情况下,范围数值之间的间隔为 1。您可以使用 step 属性更改它:

实例

<input type="range" class="form-range" step="10">

亲自试一试

最小值和最大值

默认情况下,最小值为 0,最大值为 100。您可以使用 min 和/或 max 属性更改它:

实例

<input type="range" class="form-range" min="0" max="4">

亲自试一试