栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

Bootstrap所支持的表单控件实例详解

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

Bootstrap所支持的表单控件实例详解

 Bootstrap所支持的表单控件如下所示:

Bootstrap 支持最常见的表单控件,主要是 input、textarea、checkbox、radio 和 select。

输入框(Input)

最常见的表单文本字段是输入框 input。用户可以在其中输入大多数必要的表单数据。Bootstrap 提供了对所有原生的 HTML5 的 input 类型的支持,包括:text、password、datetime、datetime-local、date、month、time、week、number、email、url、search、tel 和 color。适当的 type 声明是必需的,这样才能让 input 获得完整的样式。




Bootstrap 实例 - 输入框







结果如下所示:

文本框(textarea)

当您需要进行多行输入的时,则可以使用文本框 textarea。必要时可以改变 rows 属性。




Bootstrap 实例 - 文本框







结果如下所示:

复选框((Checkbox)和单选框(Radio)

复选框和单选按钮用于让用户从一系列预设置的选项中进行选择。

当创建表单时,如果您想让用户从列表中选择若干个选项时,请使用 checkbox。如果您限制用户只能选择一个选项,请使用 radio。

对一系列复选框和单选框使用 .checkbox-inline 或 .radio-inline class,控制它们显示在同一行上。

下面的实例演示了这两种类型(默认和内联):




Bootstrap 实例 - 复选框和单选按钮



























结果如下所示:

复选框和单选按钮

当您想让用户从多个选项中进行选择,但是默认情况下只能选择一个选项时,则使用选择框。

使用