bootstrap学习11--表单(下)

校验状态

.has-success,.has-warn 等 

.form-control 这个类在表单控制中非常关键，很多的控件效果 都是基于这个类的定义之下才显示出来效果的。

添加额外的图标

.has-feedback

反馈图标（feedback icon）只能使用在文本输入框 <input class="form-control"> 元素上。 只能使用在文本框上！！！！

<div class="form-group has-success has-feedback">
  <label class="control-label" for="inputSuccess2">Input with success</label>
  <input type="text" class="form-control" id="inputSuccess2" aria-describedby="inputSuccess2Status">
  <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>
  <span id="inputSuccess2Status" class="sr-only">(success)</span>
</div>

利用字体图标 glyphicon glyphicon-* 设定图标 

form-control-feedback 修饰具体控件

<div class = "input-group">

<span class="input-group-addon" >@</span>

</div>

控件尺寸

.input-lg .input-sm 

水平排列的按钮组和表单组的尺寸 

.form-group-lg 或 .form-group-sm 

调整列（column）尺寸

用栅格系统中列 包裹输入元素 可以轻松设置输入框的宽度

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