<li><a href="#">首页</a></li><li><a href="#">资讯</a></li><li><a href="#">关于</a></li>
</ul>
</div>
設置數據：
li.dropdown-header //設置頭，不加超鏈接
li.divider //設置分割線(下方)
li.disabled //禁用
div .dropdown .open //菜單默認顯示
13、按鈕組
.btn-group //按鈕組
.btn-group-lg //大型號按鈕組
.btn-group-sm //中型號按鈕組
.btn-group-xs //小型號按鈕組
.btn-group-vertical //垂直按鈕組
.btn-group-justified //兩端對齊按鈕組
.btn-group .dropup //向上彈出
多個按鈕組整合：
div.btn-toolbar>div.btn-group*3>div .btn .btn-default *3
14、導航
.nav .nav-tabs //基本導航
.nav .nav-pills //膠囊式導航
.nav .nav-pills .nav-stacked //垂直膠囊
.nav .nav-tabs .nav-justified //兩端對齊
.navbar .navbar-default //基本導航條
.navbar .navbar-inverse //反色導航條
導航條標題(div .navbar .navbar-default 下使用)
<div>
<a href="#">标题</a>
</div>
其他導航條
ul .nav .navbar-nav
導航條中用form
窗体顶端
form .navbar-form .navbar-right
導航條中用button
button .btn .btn-default .navbar-btn
導航條中用文本
p .navbar-text
非導航鏈接(在文本區域中使用)
a .navbar-link
導航條始終在頂部
.navbar .navbar-default .navbar-fixes-top
導航條始終在底部
.navbar .navbar-default .navbar-fixes-bottom
靜態導航條
.navbar .navbar-default .navbar-static-top
導航中對齊方式
.navbar-right
.navbar-left
15、分頁標籤
分頁：
<ul>
<li><a href="#">«</a></li>
<li class=’active’><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">»</a></li>
</ul>
尺寸：
ul .pagination .pagination-lg //大呎寸
其他尺寸：.pagination-sm 和 .pagination-xs
翻頁效果：
<ul>
<li><a href="#">上一页</a></li>
<li><a href="#">下一页</a></li>
</ul>
靠左右兩邊の翻頁：
<ul>
<li><a href="#">上一页</a></li>
<li><a href="#">下一页</a></li>
</ul>
16、標籤顏色（.label必須有）
.label-primary、.label-success、.label-info、.label-warning、.label-danger
alert警告框の顏色（.alert必須有）
.alert-primary、.alert-success、.alert-info、.alert-warning、.alert-danger
徽章：
提交<span>3</span>
巨幕組件：
div.jumbotron>div.container
div.container>div.jumbotron
頁頭組件：
div.page-header
可縮略の圖塊
div .thumbnail
嵌入效果
div .well
div .well .well-lg
17、進度條
div.progress
<div>
<div>60%</div>
</div>
.progress和.progress-bar必須加上
.progress-bar-success : 成功綠
.progress-bar-striped : 斑馬紋
18、媒體對象
左媒右文：
<div class=’media>
div .media-left>img
div .media-body>h4 .media-heading +p
</div>
左文右媒：
<div class=’media’>
div .media-body>h4 .media-heading +p
div .media-right>img
</div>
媒體對象列表：將文媒放在此下面
ul .media-list>list .media
嵌套：
div .media-body下再次嵌套div .media
19、列表組件
ul .list-group>li .list-group-item
div .list-group>a .list-group-item
div .list-group>button .list-group-item
.list-group : 列表(list)組
.list-group-item : 列表(list)項
列表顏色：
.list-group-item-success : 成功綠
.list-group-item-info : 信息藍
.list-group-item-danger : 危險紅
列表內嵌文本(標題+文本)：
div .list-group>a .list-group-item>h4+p.list-group-item-text
20、面板組件
div .panel .panel-default
>div .panel-heading
+div .panel-body
+div .panel-footer
面板情景：