Bootstrap 3 之 Bootstrap 面板

Bootstrap 面板是一个非常常用的组件,用于在网页上显示信息或内容块。面板可以用来展示警告信息、通知、内容摘要等。在 Bootstrap 3 中,面板有两种类型:基本面板和面板组。

基本面板

基本面板是一个简单的面板,用于展示单个内容块。它有一个白色背景和圆角边框。

---- ------------ ---------------
  ---- --------------------------------
  ---- -----------------------------
------

在上面的示例中,panel panel-default 类用于定义一个基本面板,panel-heading 类用于定义面板的标题,panel-body 类用于定义面板的内容。

面板样式

除了基本面板外,Bootstrap 还提供了不同样式的面板,包括主要面板、成功面板、信息面板、警告面板和危险面板。

主要面板

主要面板用于突出显示重要内容。

---- ------------ ---------------
  ---- --------------------------------
  ---- -----------------------------
------

成功面板

成功面板用于显示成功或正面信息。

---- ------------ ---------------
  ---- --------------------------------
  ---- -----------------------------
------

信息面板

信息面板用于显示一般信息。

---- ------------ ------------
  ---- --------------------------------
  ---- -----------------------------
------

警告面板

警告面板用于显示警告信息。

---- ------------ ---------------
  ---- --------------------------------
  ---- -----------------------------
------

危险面板

危险面板用于显示危险或负面信息。

---- ------------ --------------
  ---- --------------------------------
  ---- -----------------------------
------

以上是 Bootstrap 面板的基本用法和样式,你可以根据自己的需求选择合适的面板类型来展示内容。


上一篇:Bootstrap 列表组
下一篇:Bootstrap Well