在 twiiter-bootstrap 中使用 input-group 和 select 的替代标准代码

Question

我在引导程序中有这段代码：

<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 在 WebKit 浏览器中无法完全设置样式

所以我不能将输入组与选择一起使用！

在引导程序中有标准的方法吗？

Answer 1

Bootlint 会导致错误 E006 显示

.input-group 中的非 .form-control

你应该使用form-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>