在HTML5中,输入框(input)标签中的type支持了更多的类型,有text、password、datetime、datetime-local、date、month、time、week、number、email、url、search、tel和color。标签<input>上只有赋值了特定的type才能显示正确的样式。我们一般在<input>中设置class="form-control",其实input中的很多类型需要在手机上才能看到其效果。
下拉框(select)也是表单中的基本组件,Bootstrap中的下拉菜单和HTML中的一致,在使用的时候也需要在select中添加class="form-control"。如果需要实现多选,则可以设置属性multiple="multiple"。下面的代码定义了两个select组件,第一个是单选,第二个是多选,页面运行效果如图所示。
文本域(textarea)的使用方式和HTML的默认用法一致,这里在样式修饰上也是使用了class="form-control",如果使用了该样式,则无须使用cols属性。"form-control"默认设置其宽度为100%,我们可以使用rows设置高度,使用cols来设置其长度。下面代码展示了其最基本的用法: