我有一个简单的 HTML 范围滑块。最小值为 0 最大值为 30。
我想在滑块下方放置标签,但只能每 5 个。
代码如下所示,演示页面在这里 -https://premiecheck-omzetgarant.nl/CalcTool/test.html
<div class="slidecontainer">
<input type="range" min="0" max="30" value="0" class="slider" id="myRange">
<p>Value: <span id="demo"></span></p>
</div>
您可以使用datalist
datalist {
display: flex;
justify-content: space-between;
color: red;
width: 50%;
}
input {
width: 50%;
}
<input type="range" list="tickmarks">
<datalist id="tickmarks">
<option value="0" label="0"></option>
<option value="10"></option>
<option value="20"></option>
<option value="30"></option>
<option value="40"></option>
<option value="50" label="5"></option>
<option value="60"></option>
<option value="70"></option>
<option value="80"></option>
<option value="90"></option>
<option value="100" label="10"></option>
</datalist>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)