显示间隔的 HTML 输入范围答案

【问题标题】：HTML input range showing intervals显示间隔的 HTML 输入范围
【发布时间】：2016-04-04 09:42:11
【问题描述】：

是否可以将间隔添加到 HTML 输入范围。本质上是为了让用户可以轻松地以给定的时间间隔单击该栏。我知道有一些使用 JS 和 CSS 的自定义滑块，但我只想要带有一些垂直线的标准栏。

编辑对不起，我应该更清楚：我正在寻找的是完全可视的，我将在下面发布我的代码，但我已经实现了 step 属性我想要的是在栏上显示用户的视觉表示，栏上有 5 个可能的步骤/间隔，并且是他们可以使用的。

    <input id="slider" max="5" min="1" step="1" style="width:90%; height:30%; type="range" value="5">

【问题讨论】：

【解决方案1】：

你的意思是这样（见下面的代码）？您需要将step="X" 变量添加到您的范围滑块。

什么是步骤？

使用 min 和 max 属性来限制增量可以设置数字或日期时间值。它可以是字符串 any 或 a 正浮点数。如果此属性未设置为任何，控件仅接受大于步长值倍数的值超过最小值。

&lt;input id="slider1" type="range" min="1" max="11" step="2" /&gt;

【讨论】：

【解决方案2】：

将step 属性添加到输入字段。

<input type="range" min="0" max="100" step="10">

【讨论】：