.container 类用于固定宽度并支持响应式布局的容器。
.container-fluid 类用于 100% 宽度,占据全部视口(viewport)的容器。
/* 超小屏幕(手机,小于 768px) */
@media (max-width: @screen-xs-max) { ... }
/* 小屏幕(平板,大于等于 768px) */
@media (min-width: @screen-sm-min) { ... }
/* 中等屏幕(桌面显示器,大于等于 992px) */
@media (min-width: @screen-md-min) { ... }
/* 大屏幕(大桌面显示器,大于等于 1200px) */
@media (min-width: @screen-lg-min) { ... }
使用 .col-md-offset-* 类可以将列向右侧偏移。这些类实际是通过使用 * 选择器为当前元素增加了左侧的边距(margin)。例如,.col-md-offset-4 类将 .col-md-4 元素向右侧偏移了4个列(column)的宽度。
通过使用 .col-md-push-* 和 .col-md-pull-* 类就可以很容易的改变列(column)的顺序。
h1. 36px
h2. 30px
h3. 24px
h4. 18px
h5. 14px
h6. 12px
Bootstrap 将全局 font-size 设置为 14px,line-height 设置为 1.428(即20px)。这些属性直接赋予 <body> 元素和所有段落元素。另外,<p> (段落)元素还被设置了等于 1/2 行高(即 10px)的底部外边距(margin)。
p中通过添加 .lead 类可以让段落突出显示。
对于被删除的文本使用 <del> 标签。
内联文本元素<mark>标签。
对于没用的文本使用 <s> 标签。
额外插入的文本使用 <ins> 标签。
为文本添加下划线,使用 <u> 标签。
使用 <small> 标签包裹,其内的文本将被设置为父容器字体大小的 85%。
strong-----粗体
em------斜体
<b> 用于高亮单词或短语,不带有任何着重的意味;
<i> 标签主要用于发言、技术词汇等。
text-lowercase----大写转小写
text-uppercase----小写转大写
text-capitalize----首字母小写转大写
list-unstyled------无样式列表
list-inline--------将所有元素放置于同一行
.dl-horizontal 可以让 <dl> 内的短语及其描述排在一行(dt中的内容与dd中的内容在一行显示)
<-------<
>-------/>
通过 <code> 标签包裹内联样式的代码片段
通过 <kbd> 标签标记用户通过键盘输入的内容。
多行代码可以使用 <pre> 标签。为了正确的展示代码,注意将尖括号做转义处理。
pre可使用 .pre-scrollable 类,其作用是设置 max-height 为 350px ,并在垂直方向展示滚动条。
通过 <var> 标签标记变量。
通过 <samp> 标签来标记程序输出的内容。
为任意 <table> 标签添加 .table 类可以为其赋予基本的样式 — 少量的内补(padding)和水平方向的分隔线
.table-striped 类可以给 <tbody> 之内的每一行增加斑马条纹样式。
.table-hover 类可以让 <tbody> 中的每一行对鼠标悬停状态作出响应。
.table-bordered 类为表格和其中的每个单元格增加边框。
.table-condensed 类可以让表格更加紧凑,单元格中的内补(padding)均会减半。
通过这些状态类可以为行或单元格设置颜色。
.active ----鼠标悬停在行或单元格上时所设置的颜色
.success ----标识成功或积极的动作
.info -------标识普通的提示信息或动作
.warning ------标识警告或需要用户注意
.danger --------标识危险或潜在的带来负面影响的动作