学会使用引导基本控件(表、窗体,按钮)
引导程序为我们定义了一种简单易用的样式,我们可以完成一个简单而优雅的页面显示,只显示了几种样式。本文主要介绍以下基本控件:
1。桌子
2。形式
三.按钮
1。窗体(表)仍然用于显示窗体。以下类用于控制表的属性,表样式默认采用父容器
标题1
标题两
标题三
一
二
三
四
五
六
响应表可以用任何创造。表the.table-responsive,将卷上的小屏幕设备(小于768px)。当屏幕大768px宽度、水平滚动条消失。
2。形式,形式,就像几种风格的定义
标签和控件都包裹在形成集团型的div,用默认的形式如下
电子邮件地址
<输入type=emailclass=格式控制id=exampleinputemail1
占位符输入电子邮件>
密码
<输入类型窗体控件
id=exampleinputpassword1占位符=密码>
我查出来
提交
内联的形式,指定SR只类的标签,可以隐藏标签,但是你不能省略标签。
电子邮件地址
<输入type=emailclass=格式控制id=exampleinputemail1
占位符输入电子邮件>
密码
<输入类型窗体控件
id=exampleinputpassword1占位符=密码>
我查出来
提交
卧式形式,指定的标签和标签组的长度,网格系统的布局。标签右对齐,左对齐和标签组。
电子邮件
地址
<输入type=emailclass=格式控制id=exampleinputemail1
占位符输入电子邮件>
密码
<输入类型窗体控件
id=exampleinputpassword1占位符=密码>
我查出来
提交
表单验证,bootstrap3支持表单自定义验证。必须说的形式要求,node.setcustomvalidity可以设置成自定义验证
电子邮件
地址
<输入type=emailclass=格式控制id=exampleinputemail1
占位符
密码
<输入类型窗体控件
id=password1占位符=密码要求的变化=checkPassword()>
password2
<输入类型窗体控件
id=password2占位符=password2要求>
我查出来
提交
功能checkPassword(){
var = $(# PWD1 password1)。瓦迩();
无功pwd2 = $(# password2 )瓦迩();
如果(PWD1!= pwd2){
document.getelementbyid(password1)。SetCustomValidity(输入的两个密码不一致);
{人}
document.getelementbyid(password1)。SetCustomValidity();
}
}
3的风格。按钮
使用按钮LG。BTN SM and.btn-xs,你可以得到不同大小的纽扣。adding.btn-block的按钮可以使它的父节点100%的宽度,和按钮也成为一个块级元素(块),或添加元素的按钮类。
违约
原发性
成功
信息
警告
危险
链接
链接
按钮
以上是本文的全部内容,希望能对大家有所帮助。