如何调整selectpicker下拉列表的高度

Question

我的页面中有一个selectpicker(bootstrap),其中的选项是dyanmically加载.它有大量的列表但不好看.我想减少selectpicker的高度.我给了内联样式,但它没有反映.

这是我的代码

<select class="selectpicker" data-dropup-auto="false" id="estType" name="estType">
   <option selected disabled value="0">Select</option>'
</select>

我的js代码

$function ({
    $.ajax({
        datatype: "json",
        type: "GET",
        async: false,
        url: "Establishment/GetPrePopulationDetails",
        success: function (result, success) {
            var esttypes = $.map(result['EstablishmentTypes'],
                function (key, value) {
                    return $('<option>', { value: value, text: key });
                });
            $('#estType').append(esttypes);
        },
        error: function (xhr, ajaxOptions, thrownError) {
            console.error(xhr.status);
            console.error(thrownError);
        }
    });
});

Answer 1

我自己纠正了......

只需添加data-sizehtml即可

<select class="selectpicker" data-dropup-auto="false" data-size="5" id="estType" name="estType">
   <option selected disabled value="0">Select</option>'
</select>

Answer 2

使用引导选择，data-size不适合我的工作。我需要用以下方法覆盖CSS：

div.dropdown-menu.open{
  max-height: 314px !important;
  overflow: hidden;
}
ul.dropdown-menu.inner{
  max-height: 260px !important;
  overflow-y: auto;
}

根据需要更改大小。