具有固定宽度和滚动条的 HTML 选择元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2281489/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML select element with fixed width and scrollbars
提问by schmimd04
This is probably a basic CSS question, but I am not fluent in CSS and just seem to be going in circles.
这可能是一个基本的 CSS 问题，但我对 CSS 并不流利，似乎只是在兜圈子。
Here's what I have in English: I have a fixed width select element of 400px. The text for each of the options does not fit in that 400px width. I don't get a horizontal scroll bar, it just cuts off the text. How do I get the scroll bar?
这是我的英语：我有一个固定宽度的 400px 选择元素。每个选项的文本都不适合 400 像素的宽度。我没有水平滚动条，它只是切断了文本。我如何获得滚动条？
Here's what I have in HTML/CSS:
这是我在 HTML/CSS 中的内容：
<div>
<select style="width=400px">
<option>this text is too wide to fit and gets cut off.....</option>
...
</select>
</div>
I've tried the overflow property, but I'm either using it incorrectly or it doesn't work on the select element.
我已经尝试过溢出属性，但我要么使用不当，要么在 select 元素上不起作用。
How do I get the horizontal scroll bar?
如何获得水平滚动条？
回答by Pekka
Form elements are notoriously difficult to style.
众所周知，表单元素很难设计样式。
For your width setting, you have a small typo. You need
对于您的宽度设置，您有一个小错字。你需要
<select style="width: 400px">
Otherwise, I think horizontal scrollbars can't be achieved using a normal selectelement. You would have to resort to a JavaScript based alternative like SexyCombo, which may be customizable to have a scroll bar. More options here: 11 jQuery Plugins to Enhance HTML Dropdowns
否则，我认为使用普通select元素无法实现水平滚动条。您将不得不求助于基于 JavaScript 的替代方案，如SexyCombo，它可以自定义为具有滚动条。这里有更多选项：11 个 jQuery 插件来增强 HTML 下拉菜单
回答by Select0r
- it should be
<select style="width: 400px;">(not "width=") - a regular HTML-select doesn't have a scrollbar, no matter what you do :)
- 它应该是
<select style="width: 400px;">（不是“width=”） - 无论您做什么，常规的 HTML 选择都没有滚动条:)
回答by Vyankatesh Shirde
you are using inline css syntax you should use style="width: 400px;"
您正在使用内联 css 语法，您应该使用 style="width: 400px;"
And if you have use multiple selection you just use
如果您使用多项选择，则只需使用
<select multiple style="width: 400px;">
