HTML输入范围显示间隔

时间:2016-04-04 09:42:12

标签: html input range intervals

是否可以将间隔添加到HTML输入范围。基本上这样,用户可以轻松地按给定的间隔单击该栏。我知道有一些使用JS和CSS的海关滑块,但我只想要标准的条形图上有一些垂直线条。

修改 对不起,我应该更清楚: 我正在寻找的是完全可视化的,我将在下面发布我的代码,但我已经实现了我想要的步骤属性是条形图上的可视化表示,向用户显示条形图上有5个可能的步骤/间隔是他们可以得到的。

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

2 个答案:

答案 0 :(得分:2)

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

什么是步骤

  

使用minmax属性来限制增量   可以设置数字或日期时间值。它可以是字符串any或a   正浮点数。如果此属性未设置为任何,   控件仅接受步长值的倍数处的值   比最低限度。

Mozilla Developer Network了解详情。

<input id="slider1" type="range" min="1" max="11" step="2" />

答案 1 :(得分:0)

step属性添加到输入字段。

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