前面的话
<p> 表单是用来与用户做交流的一个网页控件，良好的表单设计能够让网页与用户更好的沟通。表单中常见的元素主要包括：文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。其中每个控件所起的作用都各不相同，而且不同的浏览器对表单控件渲染的风格都各有不同。
<p> 同样，表单也是Bootstrap框架中的核心内容，本文将详细介绍Bootstrap的表单
基础表单
<p> 对于基础表单，Bootstrap并未对其做太多的定制性效果设计，仅仅对表单内的fieldset、legend、label标签进行了定制
fieldset
{ min-width: 0; padding: 0; margin: 0; border: 0;
}legend
{ display: block; width: 100%; padding: 0; margin-bottom: 20px; font-size: 21px; line-height: inherit; color: #333; border: 0; border-bottom: 1px solid #e5e5e5;
}label
{ display: inline-block; margin-bottom: 5px; font-weight: bold;
}登录后复制
<p> 主要将这些元素的margin、padding和border等进行了细化设置
<p> 当然表单除了这几个元素之外，还有input、select、textarea等元素，在Bootstrap框架中，通过定制了一个类名`form-control`，也就是说，如果这几个元素使用了类名“form-control”，将会实现一些设计上的定制效果
<p> 1、宽度变成了100%
<p> 2、设置了一个浅灰色（#ccc）的边框
<p> 3、具有4px的圆角
<p> 4、设置阴影效果，并且元素得到焦点之时，阴影和边框效果会有所变化
<p> 5、设置了placeholder的颜色为#999
<form>
<div class="form-group"><label for="exampleInputEmail1">Email address</label><input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
</div>
<div class="form-group"><label for="exampleInputPassword1">Password</label><input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
</div>
<div class="form-group"><label for="exampleInputFile">File input</label><input type="file" id="exampleInputFile"><p class="help-block">Example block-level help text here.</p>
</div>
<div class="checkbox"><label> <input type="checkbox"> Check me out</label>
</div>
<button type="submit" class="btn btn-default">Submit</button></form>
登录后复制
水平表单
<p> Bootstrap框架默认的表单是垂直显示风格，但很多时候我们需要的水平表单风格
<p> 通过为表单添加
.form-horizontal 类，并联合使用 Bootstrap 预置的栅格类，可以将
label 标签和控件组水平并排布局。这样做将改变
.form-group 的行为，使其表现为栅格系统中的行（row），因此就无需再额外添加
.row 了
<p> 在
