第三章 表单 3-4 表单控件

1、输入框input
bootstrap通过对input标签的type属性进行识别，得到相应的格式，所以input标签一定要对type进行指定。另外，还需通过form-control对输入框进行规范统一，此外，可以用placeholder对框内内容进行初始化。

<form role="form">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter email">
<input type="text" class="form-control" placeholder="Enter userName">
</div>
</form> 

2、下拉选择框
Bootstrap框架中的下拉选择框使用和原始的一致，多行选择设置**multiple**属性的值为**multiple**。Bootstrap框架会为这些元素提供统一的样式风格。如：

<form role="form"> //表单格式
<div class="form-group"> //类：控件群
  <select class="form-control"> //每个控件都需要（表单-控制）类
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
  </select>
  </div>
  <div class="form-group"> 
  <select multiple class="form-control"> //多行选择multiple
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
  </select>
</div>
</form>

3、文本域(textarea)

文本域和原始使用方法一样，设置**rows**可定义其高度，设置**cols**可以设置其宽度。但如果**textarea**元素中添加了类名“**form-control**”类名，则无需设置cols属性。因为Bootstrap框架中的“form-control”样式的表单控件宽度为**100%**或**auto**。

<form role="form">
<div class="form-group">
<textarea class="form-control" rows="3"></textarea>
</div>
</form>