Bootstrap内容排版表格

1.大标题

H1－H6字段大小(h1-h3上下边距都是20px,h4-h6上下边距是10px)

(H1-36px h2-30px h3-24px h4-18px h5-14px h6-12px)

2.小标题<small>

<small>与大标题搭配使用为h1-h3主标题65%，h4-h6主标题的75%的高

3.段落<p> font-size=14px,ling-height=1.4 margin-botton:10px

如要突出某个段落可用<p class="lead">

4.突出标记<mark>带有浅浅背景色

5.删除线标记<del>与<s>

6.下划线标记<ins>与<u>

7.加粗标记<strong>与<b>

8.斜体标记<em>与<i>

9.文本对齐方式

text-left左对齐  text-right右对齐  text-center居中对齐  text-justify两端对齐

10.字母大小写

text-lowercase将字母转化为小写  text-uppercase将字母转化为大写  text-capitalize首字母大写

11.鼠标悬停跟踪内容<abbr>与<title>

<p>bootstrp container<abbr title="显示内容">鼠标放在上面</abbr></p>

12.引用样式<blockquote> 引用内容包含在P标签内

<blockquote>
　　<p>时就会显示完整内容，Bootstrap 实现了对 HTML 的</p>
　　<footer>析华社</footer>
　　<cite>记者</cite>
</blockquote>

13.列表

<ul><li>...</li></ul>无序列表

<ol><li>...</li></ol>有序列表

<dl><dt>...</dt><dd>...</dd></dl>自定义列表

list-inline水平对齐  list-unstyle去掉前序符  dl-horizontal自定义列表水平对齐

14.代码

<code>一般针对单个语句的代码

<pre>一般用于多行代码块

<kbd>一般用于表示用户要通过键盘输入内容

<var>用于标记变量信息

<samp>用于标记输出内容

15.表格table

table:基础表格

table-striped:表示斑马线表格

table-bordered:带边框表格

table-hover:鼠标悬停高亮的表格

table-condensed:紧凑型表格

table-responsive:响应式表格,可视区域小于768会也出现滚动条，大于则消失

active:标记当前活动的信息

success:表示成功行为

info:表示提示行为

warning:表示警告行为

danger:表示危险行为

<div class="table-responsive">
<table class="table table-striped table-bordered table-condensed table-hover">
<thead>
<tr>
<td>标题1</td>
<td>标题2</td>
<td>标题3</td>
</tr>
</thead>
<tr>
<td>内容1</td>
<td>内容2</td>
<td>内容3</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
<td>内容3</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
<td>内容3</td>
</tr>
</table>
</div>