如何将搜索图标添加到我的按钮

Question

如何将Glyphicon搜索图标添加到我的搜索按钮。这是按钮的引导代码。

  <form class="navbar-form navbar-right">
    <div class="form-group">
      <input type="text" class="form-control" placeholder="Search">
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
  </form>

如何添加glyphicon glyphicon-search代替提交文本？

Answer 1

使用以下范围替换提交文本：

<span class="glyphicon glyphicon-search"></span>

可以找到有关glyphicon代码的更多详细信息here。

我个人使用font-awesome，因为我喜欢他们对图标库的不断更新。

Answer 2

只需将带有glyphicons类的span元素附加到按钮上。

<button type="submit" class="btn btn-default">
  <span class="glyphicon glyphicon-search"></span> Submit
</button>

Answer 3

<button type="button" class="btn btn-default">
  <span class="glyphicon glyphicon-search"></span>
  Search
</button>