bootstrap布局组件

1.字体图标：在导入jQuery和bootstrap的css和js后，通过添加特定的类名调用不同的字体图标。

2.下拉菜单：如需使用下拉菜单，只需要在 class .dropdown 内加上下拉菜单即可。

3.按钮组：该 class 用于形成基本的按钮组。在 .btn-group 中放置一系列带有 class .btn 的按钮。

4.输入框组:把前缀或后缀元素放在一个带有 class .input-group 的 <div> 中

5.导航元素：以一个带有 class .nav 的无序列表开始。添加 class .nav-tabs。

6.导航栏：向 <nav> 标签添加 class .navbar、.navbar-default。

7.分页：.pagination添加该 class 来在页面上显示分页。

8.徽章：徽章（Badges）主要用于突出显示新的或未读的项。如需使用徽章，只需要把 <span class="badge"> 添加到链接、Bootstrap 导航等这些元素上即可。

9.超大屏幕：创建一个带有 class .jumbotron. 的容器 <div>

10.页面标题：把标题放置在带有 class .page-header 的 <div> 中

11.缩略图：在图像周围添加带有 class .thumbnail 的 <a> 标签

12.进度条：添加一个带有 class .progress 的 <div>。接着，在上面的 <div> 内，添加一个带有 class .progress-bar 的空的 <div>。添加一个带有百分比表示的宽度的 style 属性，例如 style="width: 60%"; 表示进度条在 60% 的位置

13.列表组：向元素 <ul> 添加 class .list-group。向 <li> 添加 class .list-group-item。

14.面板：面板组件用于把 DOM 组件插入到一个盒子中。创建一个基本的面板，只需要向 <div> 元素添加 class .panel 和 class .panel-default 即可

15.well：Well 是一种会引起内容凹陷显示或插图效果的容器 <div>。为了创建 Well，只需要简单地把内容放在带有 class .well 的 <div> 中即可