Bootstrap基础表单

Bootstrap对基础表单未做太多的定制化效果设计，默认都使用全局设置，只是对表单内的fieldset、legend、label标签进行了设定，将这些元素的margin、padding、border等进行了细化设置。详细请参考源码1854行以后的代码。

如果在select、input、textarea元素上应用了.form-control样式，显示的宽度会变成100%，并且placeholder的颜色都设置成了#999999。主要源码如下：
// 源码1689行
.form-control {
  display: block;
  width: 100%;    /* 设置宽度是100% */
  /* 省略部分设置 */
  border: 1px solid #ccc;  /* 边框设置 */
  border-radius: 4px;   /* 圆角设置*/
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control:focus {
  border-color: #66afe9;   /* 作用域得到焦点时的边框颜色*/
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175,
      233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175,
              233, .6);
}
.form-control:-moz-placeholder {  color: #999;
      /* placeholder的文本颜色:moz浏览器*/}
.form-control::-moz-placeholder {  color: #999;
    /* placeholder的文本颜色:moz浏览器*/  opacity: 1;}
.form-control:-ms-input-placeholder {  color: #999;
      /* placeholder的文本颜色:IE浏览器*/}
.form-control::-webkit-input-placeholder {  color: #999;
      /* placeholder的文本颜色:webkit浏览器*/}


使用方式如下：
    <form>
       <fieldset>
         <legend>用户登录</legend>
         <div class="form-group">
             <label>登录账户</label>
             <input type="email" class="form-control" placeholder="请输入你
                 的用户名或Email">
         </div>
         <div class="form-group">
             <label>密码</label>
             <input type="text" class="form-control" placeholder="请输入你的密码">
         </div>
         <div class="checkbox">
             <label><input type="checkbox">记住密码</label>
         </div>
         <button type="submit" class="btn btn-default">登录</button>
       </fieldset>
    </form>