当前第2页 返回上一页
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <p class = "container" >
<form action= "#" method= "post" class = "form-horizontal" >
<p class = "form-group" >
<label for = "user" class = "col-lg-2 control-label" >用户名</label>
<p class = "col-lg-10" ><input type= "text" name= "user" id= "user" value= "" class = "form-control" /></p>
</p>
<p class = "form-group" >
<label for = "pd" class = "col-lg-2 control-label" >密码</label>
<p class = "col-lg-10" ><input type= "password" name= "pd" id= "pd" value= "" class = "form-control" /></p>
</p>
<p class = "form-group col-lg-5 col-lg-offset-5" >
<p class = "col-lg-5 col-lg-offset-5" ">
<input type= "checkbox" name= "" id= "cx" value= "" />
<label for = "cx" >是否同意</label>
</p>
<p class = "col-lg-2 col-lg-offset-5" >
<button type= "submit" class = "btn btn-success" >提交</button>
</p>
</form>
</p>
|
这里的 control-label 是给 label 同步 input 的样式
字体图标
出于性能的考虑,所有图标都需要一个基类和对应每个图标的类。把下面的代码放在任何地方都可以正常使用。注意,为了设置正确的内补(padding),务必在图标和文本之间添加一个空格。具体字体图标,请访问Bootstrap中文网(https://v3.bootcss.com/components/)查询。
总结:以上就是本篇文的全部内容,希望能对大家的学习有所帮助。
以上就是Bootstrap学习之表单格式与字体图标的详细内容,更多文章请关注木庄网络博客!
返回前面的内容
相关阅读 >>
bootstrap收费吗
bootstrap怎么学
bootstrap如何兼容ie6
layui和bootstrap区别
html5新表单元素的图文实例
bootstrap 怎么关闭弹出框
html5 表单、select 下拉、textarea多行文本的介绍
bootstrap与html5的区别是什么
详解bootstrap中的缩略图
怎么解决bootstrap乱码问题
更多相关阅读请进入《表单》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » Bootstrap学习之表单格式与字体图标