如何制作带有垂直滚动条的下拉菜单？答案

【问题标题】：how to make a drop down menu with a vertical scroll bar?如何制作带有垂直滚动条的下拉菜单？
【发布时间】：2010-10-09 18:14:31
【问题描述】：

嗨，我需要在下拉菜单中放置一个垂直滚动条，这样一开始它只会显示 size=1 但是当我们下拉时它应该有一个垂直滚动条，任何人都可以帮助我，我将非常感谢任何帮助

【问题讨论】：

标签： php html

【解决方案1】：

如果您使用 html-dropdownbox，Natrium 建议，您可以设置选择标签的“大小”属性，以指定要显示的行数。因此，如果 - 在他的示例中 - 您将 size 设置为 3，您将拥有 3 行高的下拉框并附加一个滚动条以向下滚动到剩余的 3 个项目。

如果您的意思是 CSS，假设您在 div-tag 中显示您的下拉菜单，您可以使用类似的东西：

<div style="height:200px; overflow-y:scroll">...</div>

这为您提供了一个具有绝对高度的 div。如果 div 的内容太大，会自动显示一个垂直滚动条。

【讨论】：

我一开始只想要一个值，然后我们下拉后才出现垂直滚动，可以吗？
Jarus，你能详细解释一下你的下拉菜单是如何工作的吗？它是某种 CSS 或 JavaScript 菜单吗？也许您可以添加一些示例代码？

【解决方案2】：

如果您的意思是希望强制滚动条始终可见，则无法使用原生选择下拉菜单来做到这一点。本机控件中滚动条的可见性取决于下拉菜单中的条目数，并且浏览器之间在处理控件的方式上也存在差异。例如，IE6 和 IE7 似乎只有在项目数超过 30 时才显示滚动条，而 FF3 和 Chrome 在项目数超过 20 时才显示滚动条。

如果您真的非常想始终获得滚动条，则必须使用一些非本地实现，例如 jQuery FlexBox。

【讨论】：

【解决方案3】：

这不就是你需要的一个 html-dropdownbox 吗？

<select name="cars">
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
   <option value="fiat">Fiat</option>
   <option value="audi">Audi</option>
   <option value="volkswagen">Volkswagen</option>
   <option value="bmw">Bmw</option>
</select>

【讨论】：