如何使用引导程序使用输入字段正确格式化此glyphicon按钮

Question

我想在输入字段中添加一个搜索按钮，我已经完成了。这是我当前的输出。

我使用class="btn btn-xs btn-danger来获得一个带有红色背景和白色符号的按钮，就像引导危险按钮一样。但是你可以看到它没有这样做。

这是我的代码：

<div class="input-group">                      
   <span class="input-group-addon"><i class="glyphicon glyphicon-user"  aria-hidden="true"></i></span>
   <input type="text" class="form-control" id="employeeid"  placeholder="Enter ID"> 
   <span class="input-group-btn">
   <button type="button" id="search" class="btn btn-xs btn-danger">
   <span class="input-group-addon"><i class="glyphicon glyphicon-search "  aria-hidden="true"></i></span>
   </button>   
   </span>                                 
</div>

所以我该怎么办呢。谢谢

Answer 1

在<button>标记内，您有两个其他标记，每个标记都有自己的CSS。因此，您需要将background-color设置为红色，可能在<i>标记上。上面提到使用开发人员工具的提示是一个好主意，因为它会在设置background-color的位置显示更快。