官方的方法。无需自定义CSS:

<form class="form-inline" role="form">
  <div class="form-group has-success has-feedback">
    <label class="control-label" for="inputSuccess4"></label>
    <input type="text" class="form-control" id="inputSuccess4">
    <span class="glyphicon glyphicon-user form-control-feedback"></span>
  </div>
</form>

演示:http://jsfiddle.net/yajf3b7q

这个演示是基于Bootstrap文档中的一个例子。向下滚动到“可选图标”http://getbootstrap.com/css/#forms-control-validation

如果你正在使用Fontawesome，你可以这样做:

<input type="text" style="font-family:Arial, FontAwesome"  placeholder="&#xf007;" />

结果

unicode的完整列表可以在The complete Font Awesome 4.6.3图标参考中找到

您应该能够使用现有的引导类和一些自定义样式来实现这一点。

<form>
    <div class="input-prepend">
        <span class="add-on">
            <i class="icon-user"></i>
        </span>
        <input class="span2" id="prependedInput" type="text" placeholder="Username" style="background-color: #eeeeee;border-left: #eeeeee;">
    </div>         

编辑图标是通过图标用户类引用的。这个答案是在Bootstrap版本2的时候写的。你可以在下面的页面上看到参考:http://getbootstrap.com/2.3.2/base-css.html#images

这个“欺骗”的副作用是，glyphicon类会改变输入控件的字体。

小提琴

<input class="form-control glyphicon" type="search" placeholder="&#57347;"/>

如果你想摆脱副作用，你可以删除“glyphicon”类，并添加以下CSS(可能有更好的方法来设置占位符伪元素，我只在Chrome上测试过)。

小提琴

.form-control[type="search"]::-webkit-input-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}
.form-control[type="search"]:-moz-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}
.form-control[type="search"]::-moz-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}
.form-control[type="search"]:-ms-input-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}

可能有一个更干净的解决方案:

小提琴

CSS

.form-control.glyphicon {
    font-family:inherit;
}
.form-control.glyphicon::-webkit-input-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}
.form-control.glyphicon:-moz-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}
.form-control.glyphicon::-moz-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}
.form-control.glyphicon:-ms-input-placeholder:first-letter {
    font-family:"Glyphicons Halflings";
}

HTML

<input class="form-control glyphicon" type="search" placeholder="&#57347; search" />
<input class="form-control glyphicon" type="text"  placeholder="&#57352; username" />
<input class="form-control glyphicon" type="password"  placeholder="&#57395; password" />

对于Bootstrap 3.3.5，我也有一个决定:

<div class="col-sm-5">
    <label for="date">
       <input type="date" placeholder="Date" id="date" class="form-control">         
    </label>
    <i class="glyphicon glyphicon-calendar col-sm-pull-2"></i>
</div>

对于输入，我有这样的东西:

您可以使用它的Unicode HTML

所以要添加用户图标，只需添加到占位符属性，或任何您想要的位置。

你可以看看这张小抄。

例子:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <input type="text" class="form-control" placeholder="&#xe008;" style="font-family: 'Glyphicons Halflings'， Arial"> . <input type="text" class="form-control" value="&#xe008;value. " style="font-family: 'Glyphicons Halflings'， Arial"> . <input type="submit" class="btn btn-primary" value="&#xe008;submit-button" style="font-family: 'Glyphicons Halflings'， Arial">

方法，不要忘记将输入的字体设置为Glyphicon字体 下面的代码:font-family: 'Glyphicons Halflings'， Arial，其中 Arial是输入中常规文本的字体。