是否可以在html选择框中添加水平滚动条？ [英] Is it possible to add an horizontal scroll bar to an html select box?
问题描述
我有以下html代码。
I have below html code.
<!DOCTYPE html>
<html>
<body>
<select>
<option value="volvo">Volvoooooooooooooooootooooooolargeeeeeeeeeeee</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
</body>
</html>
问题是当它超出页面时，它会给出垂直滚动条。但问题是如果值太大，则选择框宽度会自动扩展以适应值的宽度。但我不希望它扩大。 如果选项值太大，我想要一个水平滚动条。
The problem is when it goes beyond the page then it gives vertical scroll bar. But the problem is if the value is too large then select box width is auto expanded to accommodate the width of the value. But i don't want it to expand. I want a horizontal scrollbar to come if the option value is too large.
我该怎么办？
推荐答案
正如其他人所说， 这不可能。但是，如果您的目标只是让选择小，同时保持选项完全可见，则不需要选项列表上的滚动条。如果您通过CSS限制选择的宽度，您将看到浏览器自动使选项列表的整个宽度可见。
As others have said, this is not possible. However, there is no need for a scrollbar on the option list if your goal is simply to make the select small while keeping the options fully visible. If you limit the width of your select through CSS, you will see that the browser automatically makes the whole width of the option list visible.
select { width: 100px; }
编辑：更宽，请参阅我之前的回答就此主题而言。如果需要，Firefox，Chrome和IE10将使选项列表比选择更宽，但IE9不会。该问题的其他答案链接到此问题并修复了旧IE： IE中的下拉列表宽度。
See my previous answer on this topic. Firefox, Chrome, and IE10 will make the option list wider than the select if necessary, but IE9 will not. The other answers to that question link to this question with fixes for old IE: Dropdownlist width in IE.
这篇关于是否可以在html选择框中添加水平滚动条？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
