在应用Bootstrap的时候， 输入框是使用率很高的元素 。 但是， 单个的输入框已经不能满足如今的用户需求了， 通常需要多个元素组合在一起形成输入框组 。 下面小编就教大家用Bootstrap来制作输入框组 。 东西/材料 Sublime Text
操作方式 01 起首用Sublime Text东西新建HTML5页面， 导入bootstrap的样式文件和剧本文件， 如下图所示
文章插图
02 然后我们挪用input-group样式来让输入框组中的元素在统一行， 如下图所示
文章插图
03 当然input-group-addon不只可以放在输入框的前面， 也可以放在输入框的后面， 如下图所示
文章插图
04 也可以经由过程input-group-lg样式让输入框组中的元素变年夜， 还有其他的一些节制大小的样式你可以查一下API
文章插图
05 接下来你也可以在input前面插手复选框， 如下图所示， 将复选框放在input-group-addon里即可
文章插图
06 还可以在输入框组中界说button按钮， 如下图所示， 按钮可以经由过程btn-default,btn-primary等来界说样式
文章插图
07 【如何用Bootstrap制作输入框组】最后也可以在输入框的前面插手下拉菜单， 这种也是比力常用的功能， 如下图所示
文章插图
以上内容就是如何用Bootstrap制作输入框组的内容啦， 希望对你有所帮助哦！
推荐阅读
- 如何运用C#的多线程技术
- 无线麦克风如何连接音响？没声音怎么办？
- 如何在ppt中加入能从头到尾的音乐
- 在Excel中，如何将数保留到小数点后零位？
- 破解版 如何下载、安装、破解origin8.0软件
- 南方装地暖需要注意什么 如何选择地暖
- 如何选择买房的楼层？
- 汽车如何节约保养费用？
- 驾考时有紧张情绪怎么缓解？
- 如何创建带阴影的右箭头标注