Bootstrap 面板
面板
Bootstrap 中的面板是一个带边框的盒子，其内容周围有一些填充
基本面板
面板使用 .panel 类创建，面板内部的内容使用 .panel-body 类
.panel-default 类用于设置面板的颜色样式。有关更多上下文类，请参阅本页的最后一个示例。
面板标题
面板标题
面板内容
.panel-heading 类为面板添加标题
示例
<div class="panel panel-default">
<div class="panel-heading">面板标题</div>
<div class="panel-body">面板内容</div>
</div>
自己试试 »
面板页脚
面板内容
.panel-footer 类为面板添加页脚
示例
<div class="panel panel-default">
<div class="panel-body">面板内容</div>
<div class="panel-footer">面板页脚</div>
</div>
自己试试 »
面板组
要将多个面板分组在一起，请将一个 <div> 包含类 .panel-group 包含在它们周围。
.panel-group 类会清除每个面板的底部边距
示例
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">面板内容</div>
</div>
<div class="panel panel-default">
<div class="panel-body">面板内容</div>
</div>
</div>
自己试试 »
带上下文类的面板
要给面板上色，请使用上下文类（.panel-default、.panel-primary、.panel-success、.panel-info、.panel-warning 或 .panel-danger）
示例
带 panel-default 类的面板
面板内容
带 panel-primary 类的面板
面板内容
带 panel-success 类的面板
面板内容
带 panel-info 类的面板
面板内容
带 panel-warning 类的面板
面板内容
带 panel-danger 类的面板
面板内容
