Bootstrap——全局CSS样式

1.栅格系统

containter：用于固定宽度并支持响应式布局的容器

container-fluid：用于100%宽度，占据全部视口（viewport）的容器

row：行，必须在container或container-fluid之内

col-md/xs-*：设置块的列宽

col-md/xs-offset-*：列偏移

col-md-push/pull：推/拉

 

2.排版

<h1><h6>：尺寸

<small>：副标题

<p></p>：段落

lead：中心内容，字体变大

<mark></mark>内敛文本，特殊的曙色

<del></del>被删除的文本

<s></s>无用文本

<ins></ins>插入文本

<u></u>：带下划线的文本

<small><small>：小号文本

<strong></strong>：着重

<em></em>：斜体

text-left/center/right/justify：左中有下对齐

text-lowercase/uppercase/capitalize：小写/大写/首字母大写

<abbr></abbr>：基本缩略语

initialism：首字母缩略语

<br>：地址

<blockquote></blockquote>：引用

<footer></footer>：表名引用来源

<cite></cite>：标签语

blockquote-reverse：内容左右对齐

list-unstyled：无样式列表

list-inline：将所有元素放置在同一行

<d1><dt></dt><dd></dd>...</d1>：描述内容

d1-horizontal：水平排列的描述

 

3.代码

<code></code>：让代码显示出来

<kbd></kbd>：标记用户通过键盘输入的内容

<pre></pre>：正确的展示代码，尖括号需要转义

<var></var>：标记变量

<samp></samp>：来标记程序输出的内容

 

4.表格

table：表格的基本样式

table-striped：条纹

table-bordered：增加边框

table-hover：鼠标悬停

table-condensed：紧缩表格

active/success/info/warning/danger：状态，颜色。

table-responsive：响应式表格，缩小时会有水平滚动条

 

5.表单

form-control：文本都会有

form-group：表单通用类，每个表单都有

form-inline：内容左对齐，并表现为inline-block级别，内联表单

sr-only：隐藏内联表单的标签

form-horizontal：水平表单

placeholder：默认值

checkbox-inline /radio-inline：多选或单选控件

form-control-static：将纯文本和label元素放置在同一行

readonly：只读

has-feedback：文本框中添加额外的值

form-group-lg/form-group-sm ：尺寸

 

 

6.按钮

btn：

btn-default：

role="button"：于在当前页面触发某些功能 -- 而不是用于链接其他页面或链接当前页面中的其他部分，必须添加

btn=lg/sm/xs：尺寸

btn-block：拉伸至父元素的100%

opacity：禁用

 

7.图片

img-responsive ：可以让图片支持响应式布局

center-block：让图片水平居中

img-rounded/circle/thumbnail：圆角/原型/边框

 

8.其它

text-info/success/danger..：文字颜色或属性

bg-info/success..：背景颜色或属性

close：”x“关闭符号

caret：三角符号

！important：让任意元素左右浮动

clearfix：清除浮动

show/hidden：显示/隐藏