Html 选择元素下拉菜单的最大高度（选项元素）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13362484/
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
max-height for select element dropdown (option elements)
提问by Danield
How do I limit the height of the dropdown of a select element - so that if the total amount of options is greater than this height - I should get a scroll in the dropdown. I'd be satisfied if I could do this in terms of pixels or number of items.
如何限制选择元素下拉列表的高度 - 以便如果选项总数大于此高度 - 我应该在下拉列表中滚动。如果我能在像素或项目数量方面做到这一点，我会很满意。
So say I had the following html markup:
所以说我有以下 html 标记：
<select>
<option selected>Select</option>
<option>This is an option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
</select>
How would I display only say the first 4 options and the rest within a scroll.
我将如何在滚动中仅显示前 4 个选项和其余选项。
Thisis what I have so far, and it's not working.
这是我到目前为止所拥有的，但它不起作用。
采纳答案by Simon Carlson
Searching around on StackOverflow, I came across this. Sadly enough, if you want to keep it a dropdown-box, you cannot achieve what you want in CSS. JavaScript or jQuery will do the trick, as said in the link, or you could use the sizeattribute on your selecttag, but this will break the dropdown-box look.
在 StackOverflow 上搜索，我遇到了这个。遗憾的是，如果您想将其保留为下拉框，则无法在 CSS 中实现您想要的效果。JavaScript 或 jQuery 可以解决问题，如链接中所述，或者您可以size在select标签上使用该属性，但这会破坏下拉框的外观。
回答by Paulo Roberto Rosa
I found the answer in CSS+HTML, you can do this way:
我在 CSS+HTML 中找到了答案，你可以这样做：
<select>
<optgroup style="max-height: 65px;" label="">
<option selected>Select</option>
<option>This is an option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
<option>This is another Option</option>
</optgroup>
</select>
