Question

我正在使用引导程序，在引导程序导航栏中，我有一个搜索表单。

代码如下：

 <form class="navbar-form navbar-left" method="POST"  role="search"  autocomplete="off">
    <div class="form-group">
              <input class="typeahead searchField" name="search" id="search" type="text" >
              <label for="search" class="glyphicon glyphicon-search" rel="tooltip" title="search"></label>
            </div>
            <button type="submit" class="btn btn-default">Search</button>
          </form>

我在输入字段中使用了glyphicon。但是输入字段旁边的按钮看起来不太好。

我如何使搜索字形图标充当提交表单的按钮？

Answer 1

如果您正在使用引导程序3，我想这就是您想要的：

<form class="navbar-form navbar-left" method="POST" role="search" autocomplete="off">
  <div class="form-group">
    <input class="typeahead searchField form-control" name="search" id="search" type="text">
  </div>
<button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-search"></i> Search</button>

图标放置在<button>标记内中，以便将其显示在按钮中。

DEMO

使用引导表单使用glyphicon提交

1 个答案: