引导和普通的HTML页面一样,定义标题都是使用标签& lt; h2>到& lt; h7>,只不过引导覆盖了其默认的样式,使用其在所有浏览器下显示的效果一样,具体定义的规则可以如下表所示:
通过比较可以发现,引导标题样式进行了以下显著的优化重置:
1,重新设置了<强> margin-top 和<强> margin-bottom 的值,,<强> h2 ~ h4 重置后的值都是<强> 20 px; <强> h5 ~ h7 重置后的值都是<强> 10 px。
2,所有标题的行高都是1.1 <强> (也就是字体大小的1.1倍),而且文本颜色和字体都继承父元素的颜色和字体。
3,固定不同级别标题字体大小,<强> h2=36 px, h3=30 px, h4=24像素,h5=18 px,仅有14 px=和<强> h7=12 px。
标题的具体运用非常简单,和我们平时运用是一样的,使用& lt; h2> ~ & lt; h7>标签,分别表示标题一至标题六,h后面的数字越大,表示级别越小,文本也越小。来看一个简单的效果:右侧代码编辑器中的10到16行的代码。
在引导中为了让非标题元素和标题使用相同的样式,还特意定义了<强> .h2 ~。h7 六个类名。
对比两个示例的效果图,可以说他们的效果是一模一样的。
& lt; !DOCTYPE HTML>
Bootstrap标题一
Bootstrap标题二
Bootstrap标题三
Bootstrap标题四
Bootstrap标题五
Bootstrap标题一
Bootstrap标题二
Bootstrap标题三
Bootstrap标题四
Bootstrap标题五
除此之外，我们在Web的制作中，常常会碰到在一个标题后面紧跟着一行小的副标题。在Bootstrap中他也考虑了这种排版效果，使用了标签来制作副标题。这个副标题具有其自己的一些独特样式：
Bootstrap标题一我是副标题
Bootstrap标题二我是副标题
Bootstrap标题三我是副标题
Bootstrap标题四我是副标题
Bootstrap标题五我是副标题
1、行高都是1，而且font-weight设置了normal变成了常规效果（不加粗），同时颜色被设置为灰色（#999）。
2、由于内的文本字体在h2~h4内，其大小都设置为当前字号的65%；而在h5~h7内的字号都设置为当前字号的75%；
详细代码请参阅bootstrap.css 强文件中第<强> 407行~第443 行。
