使用 CSS 限制下拉列表中显示的选项答案

【问题标题】：Limit displayed options in a dropdown using css使用 CSS 限制下拉列表中显示的选项
【发布时间】：2013-01-03 13:28:34
【问题描述】：

是否有任何 css 属性可以限制下拉菜单中显示的选项。

我知道在 select 中设置 size = 'value' 会将 drpdown 中显示的选项限制为该值。这可以使用 css 实现吗？

<select size="5">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>

使用此选项，可见选项的数量将限制为 5。这可以在 css 中完成吗？实际上，我的应用程序中有很多下拉菜单，为每个下拉菜单添加大小非常耗时，之后我可能需要更改显示的项目数。

【问题讨论】：

标签： html css select options

【解决方案1】：

为要更改的选择添加一个类：

<select class="limit">
...
</select>

然后使用一些 jQuery：

$('.limit').attr('size', 5);

这是example。

【讨论】：

向所有选择添加一个类与添加size 属性一样多。要在不使用类的情况下应用于所有选择，请使用 $('select').attr('size', 5); jsfiddle.net/FG6QW/1
当然。但除非 OP 希望每个选择看起来都像这样，否则将其定位到需要它的特定选择元素会更有意义。