Bootstrap学习--常用词汇

项目中高频出现的词汇

布局容器
	.container 固定宽度
	.container-fluid 全屏
	.row 行
	.col-lg- 大屏幕
	.col-md- 中屏幕

下拉菜单
	.dropdown                               下拉菜单
	.dropdown-menu                          下拉选项
	.dropup                                 上拉菜单
	.dropdown-toggle                        下拉菜单切换
	.dropdown-menu-right                    右对齐
	.dropdown-menu-left                     左对齐
	.dropdown-header                        标题
	.drivider                               分割线
	.disabled                               禁用项
	
按钮组
	.btn-group                              按钮组
	.btn-toolbar                            多重按钮组
	.btn-group-vertical                     水平按钮组
	.btn-group-justified                    两端对齐排列的按钮组

输入框组
	.input-group                            输入框组
	.input-group-addon                      单独一侧加控件
	.input-group-btn                        单独一侧加按钮

导航元素
	.nav nav-tab                            标签页
	.nav nav-pills                          胶囊式标签页
	.nav nav-pills nav-stacked              胶囊式标签页以垂直方向堆叠排列的
	.nav-justified                          两端对齐的标签页
	.disabled                               禁用的标签页
	.tab-content                            与 .tab-pane 和 data-toggle="tab" (data-toggle="pill" ) 一同使用, 设置标签页对应的内容随标签的切换而更改
	.tab-pane                               与 .tab-content 和 data-toggle="tab" (data-toggle="pill")一同使用, 设置标签页对应的内容随标签的切换而更改

导航条
	.navbar                                 
	.navbar-defalut                         默认样式
	.navbar-toggle                          响应式导航栏
	.narbar-header                          导航栏头部
	.narbar-brand                           导航栏图标
	.navbar-form                            导航栏表单
	.navbar-btn                             导航栏按钮
	.navbar-text                            导航栏文本
	.navbar-link                            非导航的链接
	.navbar-left                            左对齐
	.navbar-right                           右对齐
	.navbar-fixed-top                       固定在顶部
	.navbar-fixed-botton                    固定在底部
	.navbar-static-top                      静态的顶部
	.navbar-inverse                         反色导航栏

分页
	.pagination                             
	.disabled                               定义不可点击的链接
	.active                                 指示当前的页面

翻页
	.pager
	.previous                               上一页左对齐
	.next                                   下一页右对齐
	.disabled                               禁用

面包屑导航
	.breadrumb                              

标签
	.lable lable-default                    默认灰色标签
	.lable lable-primary                    蓝色标签
	.lable lable-success                    绿色标签
	.lable lable-info                       浅蓝色标签
	.lable lable-warning                    黄色标签
	.lable lable-danger                     红色标签

徽章
	.badge                                  

巨幕
	.jumbotron                          

页头
	.page-header                            

缩略图
	.thumbnail                              

警告框
	.alert alert-sccess                     绿色警告框
	.alert alert-info                       浅蓝色警告框
	.alert alert-warning                    黄色警告框
	.alert alert-danger                     红色警告框
	.alert-dismissible                      可关闭的警告框

进度条
	.progress                               
	.progress-bar                           显示进度百分比
	.progress-bar-striped                   条纹进度条

多媒体对象
	.media
	.media-left                             媒体左边内容
	.media-object                           媒体对象
	.media-body                             媒体主体
	.media-heading                          媒体标题
	.media-list                             媒体对象列表

列表组
	.list-group
	.list-group-item                        列表组子元素

面版
	.panel
	.panel-default                          默认面版
	.panel-body                             面版主体
	.panel-heading                          面版标题
	.panel-footer                           面版脚注

嵌入内容
	.embed-responsive                       
	.embed-responsive-item                  嵌入内容子元素

变量
	@grid-columns: 12 列数
	@grid-gutter-width: 30px 槽宽
	@grid-float-breakpoint: 768px 媒体查询阙值(确定合适让列浮动)

中心内容
	.lead 段落突出显示

内联文本元素
	< mark>< /mark> 改变包含内容背景色
	< del>< /del>< s>< /s> 删除线
	< ins>< u>< /u> 下划线
	< small>< /small> 小号文本
	< strong>< /strong> < b>< /b> 加粗
	< em>< /em>< i>< /i> 斜体

文本对齐
	.text-left 靠左
	.text-center 居中
	.text-right 靠右
	.text-justify 文本对齐
	.text-nowrap 不自动换行
	.text-lowercase 文本小写
	.text-uppercase 文本大写
	.text-capitalize 首字母大写

引用
	< blockquote>< /blockquote> 引用
	blockquote.blockquote-reverse 引用右对齐

列表
	.list-unstyled 移除默认样式
	.list-inline 所有列表放同一行
	.dl-horizontal 设置了浮动和偏移，水平排列

代码
	< code>< /code> 包裹内联样式的代码片段
	< kbd>< /kbd> 标记用户通过键盘输入的内容
	.pre-scrollable 使 < pre> 元素可滚动，代码块区域最大高度为340px

变量
	< var>< /var> 变量

表格
	.table 表格
	.table-striped 条纹状表格
	.table-bordered 带边框的表格
	.table-hover 鼠标悬停
	.table-condensed 紧缩表格
	.table-responsive 响应式表格
	.success 绿色
	.active 灰色
	.info 青色
	.warning 黄色
	.danger 红色

表单
	.form-control 向所有的文本元素 < input>、< textarea> 和 < select>
	.form-group 表单
	.form-inline 内联表单(向左对齐的，标签是并排的)
	< label for="" >< /label> 每个输入控件设置 label 标签，屏幕阅读器将正确识别
	.form-horizontal 水平排列的表单
	text 文本
	password 密码
	datetime 日期时间
	datatime-local 当地日期时间
	date 日期
	month 月
	time 事件
	input week 周
	number 数字
	email 邮件
	url 链接
	search 搜索
	tel 电话
	color 颜色
	rows=“3” 根据需要改变 rows 属性
	.checkbox 多选框
	.radio 单选框
	.checkbox-inline 内联多选框
	.radio-inline 内联单选框

选择框(select)
	.form-control 下拉菜单
	multiple=“multiple” 允许用户选择多个选项
	.form-control-static 需要在一个水平表单内的表单标签后放置纯文本时，请在上使用 class .form-control-static
	< fieldset>< /fieldset> 可以禁用 中包含的所有控件
	.has-feedback 为输入框添加额外的图标
	.form-control-feedback 为输入框添加额外的图标子元素
	.sr-only 隐藏表单控件的 （而不是使用其它标签选项，如 aria-label 属性）， 一旦它被添加，Bootstrap 会自动调整图标的位置。

按钮
	.btn 按钮
	.btn-default 默认样式
	.btn-primary 原始按钮样式
	.btn-success 绿色
	.btn-info 青色
	.btn-warning 黄色
	.btn-danger 红色
	.btn-link 链接式按钮
	.btn-block 块级按钮(拉伸至父元素100%的宽度)
	.active 激活状态
	.disabled 禁用按钮

图片
	.img-responsive 响应式图片
	.img-rounded 图片圆角
	.img-circle 圆形图片
	.img-thumbnail 缩略图/有边框

辅助类
	.pull-left 左浮动
	.pull-right 右浮动
	.center-block 水平居中
	.clearfix 清除浮动
	.show 强制元素显示
	.hidden 强制元素隐藏
	.sr-only 除了屏幕阅读器外，其他设备上隐藏元素
	.sr-only-focusable 与 .sr-only 类结合使用，在元素获取焦点时显示(如：键盘操作的用户)
	.text-hide 将页面元素所包含的文本内容替换为背景图
	.close 显示关闭按钮
	.caret 显示下拉式功能