基本类型

文本框 描述
<input type="text" class="form-control" placeholder="用户名">
<input type="email" class="form-control" placeholder="电子邮件">
<div class="checkbox">
  <label>
    <input type="checkbox"> 复选框
  </label>
</div>
<div class="checkbox disabled">
  <label>
    <input disabled type="checkbox"> 被禁用的复选框
  </label>
</div>
<div class="radio">
  <label>
    <input type="radio" name="radioOptionsExample" id="radioOptionsExample1"> 单选框1
  </label>
</div>
<div class="radio">
  <label>
    <input type="radio" name="radioOptionsExample" id="radioOptionsExample2"> 单选框2
  </label>
</div>
<div class="radio disabled"> 
  <label>
    <input type="radio" value="" disabled="disabled" name="radioOptionsExample" id="radioOptionsExample3"> 被禁用的单选框 
  </label>
</div>
<textarea class="form-control" rows="3" placeholder="可以输入多行文本"></textarea>
<input type="file" class="form-control" value="">
<select class="form-control">
  <option value="">请选择一种水果</option>
  <option value="apple">苹果</option>
  <option value="banana">香蕉</option>
  <option value="orange">桔子</option>
  ...
</select>

文本框状态

文本框 描述

<input class="form-control" type="text" placeholder="此文本框被禁用" disabled>

<input class="form-control form-focus" autofocus type="text" placeholder="请激活此文本框">

<div class="has-warning">
  <input class="form-control" type="text" placeholder="Warning...">
</div>

<div class="has-error">
  <input class="form-control" type="text" placeholder="Warning...">
</div>

<div class="has-success">
  <input class="form-control" type="text" placeholder="Warning...">
</div>

尺寸

文本框 描述
<input class="form-control input-lg" type="text" placeholder="较大尺寸的文本框">
<input class="form-control" type="text" placeholder="默认尺寸的文本框">
<input class="form-control input-sm" type="text" placeholder="小尺寸的文本框">

使用网格

使用网格来使用水平布局。

<div class="row">
  <div class="col-xs-3">
    <input type="text" class="form-control" placeholder=".col-xs-2">
  </div>
  <div class="col-xs-4">
    <input type="text" class="form-control" placeholder=".col-xs-3">
  </div>
  <div class="col-xs-5">
    <input type="text" class="form-control" placeholder=".col-xs-4">
  </div>
</div>