模态弹出窗在页面加载完成时，是被隐藏在页面中.

声明式触发方法：

方法一：模态弹出窗声明，只需要自定义两个必要的属性：data-toggle和data-target（bootstrap中声明式触发方法一般依赖于这些自定义的data-xxx 属性。比如data-toggle="" 或者 data-dismiss=""）。

方法二：触发模态弹出窗也可以是一个链接<a>元素，那么可以使用链接元素自带的href属性替代data-target属性，如：

<!-- 触发模态弹出窗的元素 -->
<a data-toggle="modal" href="#mymodal" class=" btn btn-primary" >点击我会弹出模态弹出窗</a>
<!-- 模态弹出窗 -->
<div class="modal fade"  id="mymodal" >
    <div class="modal-dialog" >
        <div class="modal-content" >
        <!-- 模态弹出窗内容 -->
        </div>
    </div>
</div>

水平定义列表就像内联列表一样，Bootstrap可以给<dl>添加类名“.dl-horizontal”给定义列表实现水平显示效果。

modal-backdrop:蒙层样式

一个是大尺寸样式“modal-lg”，另一个是小尺寸样式“modal-sm”

Bootstrap框架中的模态弹出框，分别运用了“modal”、“modal-dialog”和“modal-content”样式，而弹出窗真正的内容都放置在“modal-content”中，其主要又包括三个部分：

  ☑ 弹出框头部，一般使用“modal-header”表示，主要包括标题和关闭按钮

  ☑ 弹出框主体，一般使用“modal-body”表示，弹出框的主要内容

  ☑ 弹出框脚部，一般使用“modal-footer”表示，主要放置操作按钮

Bootstrap像去点列表一样，通过添加类名“.list-inline”来实现内联列表，简单点说就是把垂直列表换成水平列表，而且去掉项目符号（编号），保持水平显示。也可以说内联列表就是为制作水平导航而生。

Bootstrap根据平时的使用情形提供了六种形式的列表：

   ☑  普通列表

   ☑  有序列表

   ☑  去点列表

   ☑  内联列表

   ☑  描述列表

   ☑  水平描述列表

  ☑   .text-left：左对齐

  ☑   .text-center：居中对齐

  ☑   .text-right：右对齐

  ☑   .text-justify：两端对齐

• .text-muted：提示，使用浅灰色（#999）

• .text-primary：主要，使用蓝色（#428bca）

• .text-success：成功，使用浅绿色(#3c763d)

• .text-info：通知信息，使用浅蓝色（#31708f）

• .text-warning：警告，使用黄色（#8a6d3b）

• .text-danger：危险，使用褐色（#a94442）

  ☑ 模态弹出窗（Modal）的滑动和渐变效果；

  ☑ 选项卡（Tab）的渐变效果；

  ☑ 警告框（Alert）的渐变效果；

  ☑ 图片轮播（Carousel）的滑动效果。

fade :淡出，在modal类的旁边加上fade

且需要引入transition.js文件

在panel的类名基础上增加自己需要的类名 

panel样式并没有对主题进行样式设置，而主题样式是通过panel-default来设置

☑  panel-primary：重点蓝

  ☑  panel-success：成功绿

  ☑ panel-info:信息蓝

  ☑ panel-warning：警告黄

  ☑ panel-danger：危险红

  ☑  panel-heading：用来设置面板头部样式

   ☑ panel-footer：用来设置面板尾部样式

   ☑ panel-body:用来设置面板的体

panel panel-default：默认面板

  ☑ progress-bar-info：表示信息进度条，进度条颜色为蓝色

  ☑ progress-bar-success：表示成功进度条，进度条颜色为绿色

  ☑ progress-bar-warning：表示警告进度条，进度条颜色为黄色

  ☑ progress-bar-danger：表示错误进度条，进度条颜色为红色

反色导航条其实是Bootstrap框架为大家提供的第二种风格的导航条，与默认的导航条相比，使用方法并无区别，只是将navbar-deafult类名换成navbar-inverse。其变化只是导航条的背景色和文本做了修改。如下：

<div class="navbar  navbar-inverse" role="navigation">
<div class="nav bar-header">
      <a href="##" class="navbar-brand">慕课网</a>
</div>
<ul class="nav navbar-nav">
      <li class="active"><a href="">首页</a></li>
      <li><a href="">教程</a></li>
      <li><a href="">关于我们</a></li>
</ul>
</div>

“navbar-header”和“navbar-brand”来实现，示例查看代码编辑器（11-22）。

<div class="navbar-header">

  　    <a href="##" class="navbar-brand">慕课网</a>

  　</div>