Question

朴实无华的 input 默认是这样的：

<input type="text" placeholder="US Dollar">

可以为它加上前缀增补和后缀增补：

<div class="input-group">
   <span class="input-group-addon">$</span>
   <input type="text" class="form-control" placeholder="US Dollar">
   <span class="input-group-addon">.00</span>
</div>

只要把增补控件和 input 的 class="input-group" 内，其中的增补控件标记为 class="input-group-addon" 即可。当然，你可以只是做前缀增补，或者只是增加后缀增补，只要把不需要的删除就行了。

上面的案例增补的是 span 内的文字。还可以增补其他类型的控件，比如 button。并且可以不止一个：

 <div class="input-group">
   <input type="text" class="form-control" >
   <span class="input-group-btn">
     <button type="button" class="btn btn-default">Action</button>
     <button type="button" class="btn btn-default">Options</button>
   </span>
</div>

增补 checkbox 也行：

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

增补 radio 也行：

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

增补 dropdown 也行：

  <div class="input-group">
    <div class="input-group-btn">
      <button data-toggle="dropdown" class="btn btn-default dropdown-toggle" type="button">
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu"> 
        <li><a href="#">1</a></li>
        <li><a href="#">2 action</a></li>
      </ul>
    </div>
    <input type="text" class="form-control">
 </div>