数据列表是否可以向下滚动？

Question

我是HTML的新手，正在尝试使用datalist。我需要将其限制为仅显示5个项目，其余的要使用向下滚动查看。有什么办法吗？

我的代码：

<form>
    <input list="Android" name="Android">

    <datalist id="Android">
        <option value="Alpha">
        <option value="Beta">
        <option value="Cupcake">
        <option value="Doughnut">
        <option value="Eclairs">
        <option value="Fryo">
        <option value="GingerBread">
        <option value="HoneyComb">
        <option value="Icecream Sandwich">
        <option value="Jelly Bean">
        <option value="Kitkat">
        <option value="Lollipop">
        <option value="Marshmallow">
        <option value="Nougat">
    </datalist>
    <input type="submit">
</form>

这是我的代码的输出

谢谢！

Answer 1

这是不可能的，datalist布局是由浏览器定义的，与select标签所定义的一样，并且自定义的灵活性很小。您的示例来自 Chrome ；在 Firefox 中，它仅显示6个项目，在 Edge 中，它也显示类似的内容，但大小受限制。

建议的解决方案使用的是其他方法，而不是使用datalist，如果您不能忍受{strong> Chrome 提供的datalist设计，请尝试使用其他类似的组件行为，例如dropdown select，autocomplete，autosugest，typeahead等。