将“fa fa search”添加到文本框

Question

更新代码：

添加建议的<span class="input-group-addon">.00</span>后，这就是现在呈现的内容：

我尝试使用style="margin-left:200px;"但没有做任何事情

更新结束

如何在文本框的右侧添加fa fa search？这是我渲染代码后的html：

<div class="form-group">
    <label class="col-sm-2 control-label">Search </label>
    <div class="input-group" style="margin-left:210px">
        <span class="input-group-addon"><i class="fa fa-search"></i></span>
        <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span>
        <input class="form-control ui-autocomplete-input" data-jqui-acomp-delay="200" data-jqui-acomp-hiddenvalue="PartId" data-jqui-acomp-minlength="2" data-jqui-acomp-source="/Search" data-jqui-type="autocomplete" id="Part" name="Part" placeholder="Search..." required="required" style="width:215px !important;" type="text" value="" data-parsley-id="6454" autocomplete="off">
        <ul class="parsley-errors-list" id="parsley-id-6454"></ul>
        <input id="PartId" name="PartId" type="hidden" value="" data-parsley-id="9361">
        <ul class="parsley-errors-list" id="parsley-id-9361"></ul>

    </div>
</div>

如果我只是在文本框旁边添加span，那就是它呈现的内容：

<span class="input-group-addon"><i class="fa fa-search"></i></span>

Answer 1

我认为这就是您所寻找的（在输入后移动跨度并确保图标跨度在输入组 - 插件范围内）

<div class="input-group">
  <input type="text" class="form-control">
  <span class="input-group-addon">
   <span class="fa fa-search"></span>
  </span>
</div>

Answer 2

<div class="input-group">
  <span class="input-group-addon">$</span>
  <input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
  <span class="input-group-addon">.00</span>
</div>

在此处查看此代码。 http://getbootstrap.com/components/#input-groups

这应该做你想要的只需添加$ is

的fa图标

另外， 您应该尝试使用Gylphicons

http://getbootstrap.com/components/