Bootstrap框架中checkbox和radio有点特殊，Bootstrap针对他们做了一些特殊化处理，主要是checkbox和radio与label标签配合使用会出现一些小问题（最头痛的是对齐问题）。使用Bootstrap框架，开发人员无需考虑太多，只需要按照下面的方法使用即可。
<form role="form"> <div> <label> <input type="checkbox" value=""> 记住密码 </label> </div> <div> <label> <input type="radio" value="love" checked> 喜欢 </label> </div> <div> <label> <input type="radio" value="hate"> 不喜欢 </label> </div> </form>
从上面的示例，我们可以得知：
1、不管是checkbox还是radio都使用label包起来了
2、checkbox连同label标签放置在一个名为“.checkbox”的容器内
3、radio连同label标签放置在一个名为“.radio”的容器内
在Bootstrap框架中，主要借助“.checkbox”和“.radio”样式，来处理复选框、单选按钮与标签的对齐方式
表单控件(复选框和单选按钮水平排列)
有时候，为了布局的需要，将复选框和单选按钮需要水平排列。Bootstrap框架也做了这方面的考虑：
1、如果checkbox需要水平排列，只需要在label标签上添加类名“checkbox-inline”
2、如果radio需要水平排列，只需要在label标签上添加类名“radio-inline”
表单控件(按钮)
input[type=“submit”
input[type=“button”
input[type=“reset”
<button>
在Bootstrap框架中的按钮都是采用<button>来实现。
有关于Bootstrap中按钮如何制作，在这里不做过多阐述，因为按钮也是Bootstrap框架中核心部分之一，后面我们专门有一节内容来介绍Bootstrap的按钮。
表单控件大小
前面看到的表单控件都正常的大小。可以通过设置控件的height，line-height，padding和font-size等属性来实现控件的高度设置。不过Bootstrap框架还提供了两个不同的类名，用来控制表单控件的高度。这两个类名是：
1、input-sm:让控件比正常大小更小
2、input-lg:让控件比正常大小更大
这两个类适用于表单中的input，textarea和select控件，具体使用如下：
<input type="text" placeholder="添加.input-lg，控件变大"> <input type="text" placeholder="正常大小"> <input type="text" placeholder="添加.input-sm，控件变小">
不管是“input-sm”还是“input-lg”仅对控件高度做了处理。但往往很多时候，我们需要控件宽度也要做一定的变化处理。这个时候就要借住Bootstrap框架的网格系统。所以你要控制表单宽度，可以像下面这样使用：
<form role="form"> <div> <div> <input type="text" placeholder=".col-xs-4"> </div> <div> <input type="text" placeholder=".col-xs-4"> </div> <div> <input type="text" placeholder=".col-xs-4"> </div> </div> … </form>
前面介绍水平表单时说过，如果表单使用了类名“form-horizontal”，其中“form-group”就相当于网格系统中的“row”。换句话说，如果没有这样做，要通过网格系统来控制表单控件宽度，就需要这样使用：
<div> <div> <input type="text" placeholder=".col-xs-4"> </div> <div> <input type="text" placeholder=".col-xs-4"> </div> <div> <input type="text" placeholder=".col-xs-4"> </div> </div>
表单控件状态(焦点状态)
表单主要用来与用户沟通，好的表单就能更好的与用户进行沟通，而好的表单一定离不开表单的控件状态。
表单状态的作用：
每一种状态都能给用户传递不同的信息，比如表单有焦点的状态可以告诉用户可以输入或选择东西，禁用状态可以告诉用户不可以输入或选择东西，还有就是表单控件验证状态，可以告诉用户的操作是否正确等。那么在Bootstrap框架中的表单控件也具备这些状态。
焦点状态是通过伪类“:focus”来实现。Bootstrap框架中表单控件的焦点状态删除了outline的默认样式，重新添加阴影效果。
要让控件在焦点状态下有上面样式效果，需要给控件添加类名“form-control”：
<form role="form"> <div> <div> <input type="text" placeholder="不是焦点状态下效果"> </div> <div> <input type="text" placeholder="焦点点状态下效果"> </div> </div> </form>
在Bootstrap框架中，file、radio和checkbox控件在焦点状态下的效果也与普通的input控件不太一样，主要是因为Bootstrap对他们做了一些特殊处理
表单控件状态(禁用状态)