引导选择选项下拉箭头未显示

php css drop-down-menu twitter-bootstrap wordpress

2022-08-30 23:52:56

我使用带类的引导选择选项字段form-control

这是我的代码：

<select class="form-control" onchange="location = this.value;">
            <option>Select a Generic Name</option>
            <option value="1">Title 1</option>
            <option value="2">Title 2</option>
 </select>

但是在下拉列表选项中向下箭头图标不显示

CSS：

.form-control {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;}

显示此图标的主要问题是什么？

答案 1

如果您使用的是 Bootstrap v5，则标记已更改为

<select class="form-select">

答案 2

我在引导选择字段中遇到了相同的问题。这是一个绝对解决问题的简单类。

在窗体控件类旁边添加窗体选择类。

<select class="form-control form-select">
    <option>Select a Generic Name</option>
    <option value="1">Title 1</option>
    <option value="2">Title 2</option>
 </select>