【Bootstrap】面板

来源:互联网 发布:nagios python 编辑:程序博客网 时间:2024/04/30 03:46

面板

虽然不是必须,但是某些时候你可能需要将某些 DOM 内容放到一个盒子里。对于这种情况,可以试试面板组件。

基本实例

默认的.panel组件所做的只是设置基本的边框(border)和内补(padding)来包装内容。

带标题的面板

通过.panel-heading可以很简单地为面板加入一个标题容器,你也可以通过添加设置了panel-title类的<h1> - <h6>标签,添加一个预定义样式的标题。

为了给链接设置合适的颜色,务必将链接放在带有panel-title类的标题标签内。

带脚注的面板

将按钮或次要的文本放入.panel-footer容器内。注意面板的脚注不会从情境效果中继承颜色,因为他们并不是主要内容。

情境效果

像其他组件一样,可以简单地通过加入有情境效果的状态类,给特定的内容使用更针对特定情境的面板。

带表格的面板

带列表组的面板

0 0