面板
在引導面板是繞其內容的一些填充有邊框的盒子:
一個基本的面板
面板是與創建.panel
類,面板內的內容有.panel-body
類:
該.panel-default
類是用來樣式面板的顏色。 看到這個頁面,了解更多內容類的最後一個例子。
面板標題
面板標題
面板內容
該.panel-heading
類添加到面板標題:
例
<div class="panel panel-default">
<div
class="panel-heading">Panel Heading</div>
<div class="panel-body">Panel
Content</div>
</div>
試一試» 面板頁腳
面板內容
該.panel-footer
類添加頁腳到面板:
例
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
<div class="panel-footer">Panel Footer</div>
</div>
試一試» 面板組
把多項面板在一起,緊裹<div>
帶班.panel-group
在他們周圍。
該.panel-group
級清除每個面板的底部利潤率:
例
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
</div>
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
</div>
</div>
試一試» 與上下文類面板
顏色的面板上,使用上下文類( .panel-default
, .panel-primary
, .panel-success
, .panel-info
, .panel-warning
,或.panel-danger
):
例
Panel with panel-default class
Panel Content
Panel with panel-primary class
Panel Content
Panel with panel-success class
Panel Content
Panel with panel-info class
Panel Content
Panel with panel-warning class
Panel Content
Panel with panel-danger class
Panel Content