我使用经典的bootsrtap css来创建一个范围。我想显示最小值和最大值，如上图所示。
只是作为文字解释[min value] [range bar/slider] [max value]
作为一条直线。
但是我的代码显示了三行[min value][range bar/slider][max value]
代码：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Bootstrap Range Input Example</title><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"></head><body><div class="container"><form><div class="form-group"><label for="rangeInput">Range Input</label>22 <input type="range" value="30" id="rangeInput" oninput="this.nextElementSibling.value = this.value"> 222<output>30</output></div></form></div><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script></body></html>
感谢你的帮助.
编辑：谢谢你的回答。但我已经添加了显示当前值。但无法使其工作。
1条答案
按热度按时间piztneat1#
你可以用一个弹性盒子。不幸的是，我不认为Bootstrap 3.2有内置的类（如果我错了，请纠正我），所以你必须使用样式标签，但最终的工作原理是一样的。
您的代码将变为：