一、bootstrap和html的寫法一樣,定義標題都是通過標籤的方式,但是bootstrap對樣式進行了重置,並且添加了.h1~.h6的類名讓不是標題的元素也能應用其樣式;
具體規則如下:
可得:1、h1~h3的margin-top和margin-bottom分別爲20px和10px;
2、所有標題的行高爲1.1,文本的顏色和字體都繼承父元素;
用法示例:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>標題(一)</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<body>
<!--Bootstrap中的標題-->
<h1>我的第一個bootstrap標題</h1>
<!--Bootstrap中讓非標題元素和標題使用相同的樣式-->
<div class="h1">傳說中的類名</div>
</body>
</html>
二、bootstrap用<small>標籤製作副標題
副標題的獨特樣式:1、行高爲1,font-weight設置爲normal,字體顏色灰色(#999);
2、在h1~h3內的small,大小設置爲當前字號的65%;在h4~h6內的small,大小設置爲當前字號的75%
用法示例:
<h1>孤兒院無私奉獻30年<small>一曲人性的讚歌</small></h1>
<div class="h1">孤兒院無私奉獻30年 <small>一曲人性的讚歌</small></div>