Bootstrap 控制面板

摘要:此章将解读 Bootstrap 控制面板(Panels)。控制面板部件用以把 DOM 部件插进到一个小盒子中。建立一个基本的控制面板,只必须向 div 原素加上 class .panel 和 class .panel_default 就可以,以下...

此章将解读 Bootstrap 控制面板(Panels)。控制面板部件用以把 DOM 部件插进到一个小盒子中。建立一个基本的控制面板,只必须向 div 原素加上 class .panel 和 class .panel_default 就可以,以下面的案例所显示:

div > 试着一下 »

結果以下所显示:

默认的面板
应用 .panel_heading class 能够非常简单地为控制面板加上题目器皿。 应用含有 .panel_title class 的 h1 _ h6 来加上预订义款式的题目。

下边的案例演试了这二种方法:

div > 试着一下 »

結果以下所显示:

面板标题

大家能够在控制面板中加上脚注,只必须把按键或是副文字放到含有 class .panel_footer 的 div 中就可以。下边的案例演试了这一点:

div > 试着一下 »

結果以下所显示:

面板脚注 面板脚注不容易从带情境颜色的控制面板中承继色调和外框,由于它并不是市场前景中的內容。 带情境颜色的控制面板

应用情境情况类 、panel_warning、panel_danger,来设定带情境颜色的控制面板,案例以下:

div > 试着一下 »

結果以下所显示:

带语境色彩的面板
带报表的控制面板

以便在控制面板中建立一个无垠框的报表,大家能够在控制面板中应用 class .table。假定有一个 div 包括 .panel_body,大家能够向报表的顶端加上附加的外框用于隔开。假如沒有包括 .panel_body 的 div ,则部件会无终断地从控制面板头顶部移动到报表。

下边的案例演试了这一点:

div > 试着一下 »

結果以下所显示:

带表格的面板


联系我们

全国服务热线:4000-399-000 公司邮箱:343111187@qq.com

  工作日 9:00-18:00

关注我们

官网公众号

官网公众号

Copyright?2020 广州凡科互联网科技股份有限公司 版权所有 粤ICP备10235580号 客服热线 18720358503

技术支持:网页申请