在 twiiter-bootstrap 中使用带有 select 的输入组的替代标准代码

Question

我在 bootstrap 中有此代码：

<div class="input-group" id="adv-search">
    <select  class="form-control"  >
        <option value="0" selected>All Snippets</option>
        <option value="1">Featured</option>
    </select>
    <div class="input-group-btn">
        <div class="btn-group" role="group">
            <div class="dropdown dropdown-lg">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span class="caret"></span></button>
                <div class="dropdown-menu dropdown-menu-right" role="menu">
                    <form class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="filter">Filter by</label>
                            <select class="form-control">
                                <option value="0" selected>All Snippets</option>
                                <option value="1">Featured</option>
                                <option value="2">Most popular</option>
                                <option value="3">Top rated</option>
                                <option value="4">Most commented</option>
                            </select>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        </div>
    </div>
</div>

我在 http://www.bootlint.com/ 中检查了我的代码。但是我有这个错误：

.input-groupcontains a <select>; this should be avoided as <select> s cannot be fully styled in WebKit browsers

所以我不能将输入组与 select!

一起使用

在 bootstrap 中有标准的方法吗？

Answer 1

Bootlint 将您引导至错误 E006，内容为

non- .form-control within .input-group

您应该使用 form-group 而不是 input-group，如下所示：

<div class="form-group">
    <label for="exampleSelect2">Example multiple select</label>
    <select multiple class="form-control" id="exampleSelect2">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
    </select>
</div>

在 twiiter-bootstrap 中使用带有 select 的输入组的替代标准代码

alternative standard code to use input-group with select in twiiter-bootstrap

css

select

webkit

twitter-bootstrap