时间戳

首页 > 解决方案 > Bootstrap - 如何在与 form-control-lg 高度相同的情况下实现更大高度的自定义选择？

html - Bootstrap - 如何在与 form-control-lg 高度相同的情况下实现更大高度的自定义选择？

问题描述

我使用的是 Bootstrap 4.3.1，并且需要使自定义选择的大小与 form-control-lg 的高度相同。

当我设置它时，<select class="custom-select mr-sm-2" id="inputAircraftSupervising" name='inputAircraftSupervising'></select>它具有默认高度并填充父 div 的宽度。这很好。 在此处输入图像描述

当我设置它时，<select class="custom-select-lg mr-sm-2" id="inputAircraftSupervising" name='inputAircraftSupervising'></select>它会更改为更大的高度，但宽度会缩小到表单控件的默认宽度。 在此处输入图像描述

如何在仍然具有更大高度的同时实现相同的宽度（填满页面的宽度）？

标签： htmlcsstwitter-bootstrapbootstrap-4

解决方案

您需要将“custom-select”和“custom-select-lg”作为选择的类一起添加（但在 custom-select-lg 之前添加自定义选择）。这里的代码：

<select class="custom-select custom-select-lg mr-sm-2" id="inputAircraftSupervising" name='inputAircraftSupervising'></select>

我对 bootply 进行了测试，对我来说效果很好：https ://www.bootply.com/GWDJRvtp3I

推荐阅读