全面解析Bootstrap排版使用方法（標題）
更新時間：2015年11月30日 10:48:50 作者：傻籽
這篇文章全面解析了Bootstrap排版使用方法，本文重點介紹Bootstrap標題排版，感興趣的小伙伴們可以參考一下
Bootstrap和普通的HTML頁面一樣，定義標題都是使用標簽<h1>到<h6>,只不過Bootstrap覆蓋了其默認的樣式，使用其在所有瀏覽器下顯示的效果一樣，具體定義的規(guī)則可以如下表所示：
<!--Bootstrap中的標題--> <h1>Bootstrap標題一</h1> <h2>Bootstrap標題二</h2> <h3>Bootstrap標題三</h3> <h4>Bootstrap標題四</h4> <h5>Bootstrap標題五</h5> <h6>Bootstrap標題六</h6> <!--Bootstrap中讓非標題元素和標題使用相同的樣式--> <div class="h1">Bootstrap標題一</div> <div class="h2">Bootstrap標題二</div> <div class="h3">Bootstrap標題三</div> <div class="h4">Bootstrap標題四</div> <div class="h5">Bootstrap標題五</div> <div class="h6">Bootstrap標題六</div>
效果如下：
除此之外，我們在Web的制作中，常常會碰到在一個標題后面緊跟著一行小的副標題。在Bootstrap中他也考慮了這種排版效果，使用了<small>標簽來制作副標題。這個副標題具有其自己的一些獨特樣式：
1、行高都是1，而且font-weight設(shè)置了normal變成了常規(guī)效果（不加粗），同時顏色被設(shè)置為灰色（#999）。
2、由于<small>內(nèi)的文本字體在h1~h3內(nèi)，其大小都設(shè)置為當前字號的65%；而在h4~h6內(nèi)的字號都設(shè)置為當前字號的75%；
<!--Bootstrap中使用了<small>標簽來制作副標題--> <h1>Bootstrap標題一<small>我是副標題</small></h1> <h2>Bootstrap標題二<small>我是副標題</small></h2> <h3>Bootstrap標題三<small>我是副標題</small></h3> <h4>Bootstrap標題四<small>我是副標題</small></h4> <h5>Bootstrap標題五<small>我是副標題</small></h5> <h6>Bootstrap標題六<small>我是副標題</small></h6>
效果如下：
如果大家還想深入學習，可以點擊這里進行學習，再為大家附兩個精彩的專題：Bootstrap學習教程 Bootstrap實戰(zhàn)教程
以上就是針對Bootstrap標題排版的詳細介紹，之后還有更多內(nèi)容會不斷更新，希望大家繼續(xù)關(guān)注。
相關(guān)文章
這篇文章主要介紹了JS實現(xiàn)判斷移動端PC端功能,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-02-02
在實際工作中經(jīng)常會遇見把秒數(shù)轉(zhuǎn)化為時分秒的問題,如何處理呢?下面這篇文章主要給大家介紹了關(guān)于JS如何將秒數(shù)轉(zhuǎn)化為時分秒形式的相關(guān)資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2023-12-12
這篇文章主要為大家詳細介紹了javascript實現(xiàn)簡單搜索功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-03-03
這篇文章主要為大家詳細介紹了Bootstrap基本組件學習筆記之下拉菜單,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
微信小程序?qū)崿F(xiàn)搜索功能并跳轉(zhuǎn)搜索結(jié)果頁面
本文主要介紹了微信小程序?qū)崿F(xiàn)搜索功能并跳轉(zhuǎn)搜索結(jié)果頁面，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-12-12
JS判斷數(shù)組是否包含某元素實現(xiàn)方法匯總
這篇文章主要介紹了JS判斷數(shù)組是否包含某元素實現(xiàn)方法匯總,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-06-06
js將類數(shù)組對象轉(zhuǎn)換成數(shù)組對象
javascript與dom有許多瑕疵，如著名的類數(shù)組對象Arguments，其他諸如HTMLCollection,NodeList如果它們都是數(shù)組的子類，那多省時啊。2010-05-05
用javascript實現(xiàn)點擊鏈接彈出"圖片另存為"而不是直接打開
用javascript實現(xiàn)點擊鏈接彈出"圖片另存為"而不是直接打開...2007-08-08
IE6中使用position導致頁面變形的解決方案(js代碼)
IE6中使用position導致頁面變形，影響用戶體驗，通過搜索可以通過js來實現(xiàn)。2011-01-01
這篇文章主要介紹了JS訪問SWF的函數(shù)用法,實例分析了javascript訪問swf文件的方法及易錯點的處理技巧,需要的朋友可以參考下2015-07-07