文章目录
一、图标字体
1.使用规则：span.class=glyphicon glyphicon-?
2.改变图标：可以使用字体样式改变图标字体。
3.alert类：简单来说就是创建一个背景色，字体也是背景色。
比如： div.class =alert alert-danger
二、按钮组
1.按钮组：
基类： div.class = .btn-group
组成： 将单个按钮放入按钮组中即可成按钮组。
div.btn-group>button.btn+button.btn
1-2.按钮组尺寸
1.大型 - .btn-group-lg
2.默认 - .btn-group
3.小型 - .btn-group-sm
4.超小 - .btn-group-xs
2.按钮工具栏：
基类： div.class = btn-toolbar
组成： 将多组按钮组放入按钮工具栏中即可。
div.btn-toolbar>div.btn-group
3.按钮组和下拉菜单嵌套
只需要嵌套到
.btn-group中的.dropdown父容器改成.btn-group
- 注意：不嵌套进去，那么下拉菜单的父容器是第一个.btn-group
那么点击后下拉菜单默认出现在父容器左边，并不会与下拉按钮对齐。
4.按钮组排列方式
1.默认水平排列
2.垂直排列：.btn-group.btn-group-vertical
3.两端对齐：.btn-group.btn-group-justified
- 按钮宽度100%，并且按钮之间均分这100%。
- 此属性关于btn为a标签时，直接使用。
- 关于btn为button标签的时候需要
div.btn-group包围button
二、输入框组
1.普通式组合：
父类 - div.input-group
基类 - span.input-group-addon + [文字，子图，单选和复选]
组合顺序不同的位置就不同
2.按钮式组合：
父类 - div.input-group
基类 - div.input-group-btn>button
三、列表组
1.用于有序或者无序标签展示
ul.list-group>li.list-group-item
加入小徽章可以自动往右对齐
2.用于普通div进行链接条目
div.list-group>a.list-group-item
3.item的背景颜色
list-group-item-infolist-group-item-successlist-group
3.item内的样式
- item头 -
h4.list-group-item-heading - item体 -
p.list-group-item-text、
3.组合框尺寸：
.input-group-lg- 默认尺寸
.input-group-sm
四、分页
1.默认分页：
容器类 - ul.pagination
– li > a
2.单上下页：
容器类 - ul.pager
组件位置
1.默认居中样式
2. .previou顶左，.next顶右
3.分页状态：
激活 - .active
禁用 - .disabled
4.分页尺寸：
大型 - .pagination-lg
默认
小型 - .pagination-sm