Bootstrap_02_(全局CSS之排版&代码&表格)

1. 排版
   1. 页面
   2. Bootstrap讲全局font-size设置为14px,line-height设置为20px，段落的行高设置为10px，颜色设置为#333。我们可以通过在页面按F12查看body的样式

段落突出：通过.lead类可以让段落突出显示，我们来看演示代码:

<div class="container">

<p>卓越人生</p>

<p class="lead">从卓景开始</p>

<p>走向人生巅峰</p>

</div>

效果看的出，从卓景开始 几个字 变大了。这个就是段落突出显示

1. 1. 标题
2. 标题h1--h6和html中的效果一样
3. 副标题：在<h1><small>副标题</small></h1>

在Bootstrap中，标题可以有副标题，副标题比正标题的字体小一点，样式有点不太一样。

<h1>卓越人生，<small>从卓景开始</small></h1>

从卓景开始  为副标题

1. 样式：class=”h1”...class=”h6”

在Bootstrap中h1- h6可以作为class的样式。来用

<p class="h1">卓越人生，从卓景开始</p>

<p class="h2">卓越人生，从卓景开始</p>

<p class="h3">卓越人生，从卓景开始</p>

<p class="h4">卓越人生，从卓景开始</p>

<p class="h5">卓越人生，从卓景开始</p>

<p class="h6">卓越人生，从卓景开始</p>

效果和直接写h1-h6的标题标签 效果一样

1. 1. 内联文本元素
      1. 标记：class=”mark”

标记，把指定的内容标记出来。示例如下:

标记：I <span class="mark"> like </span> you 很久了

被span标签包起来的文本 you 的样式被添加背景色

1. 1. 1. 线条
2. 删除：<del>I like </del> 或者<s>I like</s>
3. 下划线：<ins>I like </ins> 或者<u>I like</u>
   1. 1. 强调文本

1. 小字体<small>：标准字号的85%
2. 文本加粗：<strong>
3. 文本倾斜：<em>
   1. 对齐

1. 居左：class=”text-left”

示例代码:<p class="text-left">卓越人生，从卓京开始</p>

1. 居中：class=”text-center”

示例代码:<p class="text-center">卓越人生，从卓京开始</p>

1. 居右：class=”text-right”

示例代码：<p class="text-right">卓越人生，从卓京开始</p>

注意：span标签无效

1. 1. 改变大小写
2. 大写：class=”text-uppercase”

示例代码：<span class="text-uppercase">i like you</span>

1. 小写：class=”text-lowercase”

示例代码：<span class="text-lowercase">I like you</span>

1. 首字母大写：class=”text-capitalize”

示例代码：<span class="text-capitalize">i like you</span>

1. 1. 缩略语：当鼠标悬停在