HTML：我可以在滑块上的范围内添加标签吗？

我有一个滑动条。该滑动条具有颜色编码的范围（例如，绿色0 < 25，黄色26 < 50，橙色51 < 75，红色76 < 100），我想在滑动条本身的那些范围内添加文本标签，在滑动条下方。有没有一种方法可以做到这一点，而不必将像素与像素相匹配？滑动条的宽度也基于宽度百分比（宽度：85％），因此具有固定选项并不理想。HTML：我可以在滑块上的范围内添加标签吗？

代码滑杆：

<div className='entry-field'> 
 
    <div className='slider-text'> 
 
    Higher than: {value} 
 
    </div> 
 
    <div className='inline slider'> 
 
    <span className='limit'>0</span> 
 
    <input type="range" min="0" max="100" value={value} step="5" onChange={this.onChange}/> 
 
    <span className='limit'>100</span> 
 
    </div> 
 
</div>

来源

2016-05-17 Fred Chapman

检查了这一点，http://stackoverflow.com/questions/15195449/html5-type-range-showing-label – David

你可以只创建标签的ul，并根据他们的百分比他们的位置。

<ul class="colors"> <li class="green">Green</li> <li class="yellow">Yellow</li> <li class="orange">Orange</li> <li class="red">Red</li> </ul>

实施例：https://jsfiddle.net/vx0jn7yf/

来源

2016-05-17 18:50:13 johnniebenson

HTML：我可以在滑块上的范围内添加标签吗？

回答

相关问题