bootstrap是比较好的前端框架之一，拥有简洁的UI界面和丰富的组件，本篇经验主要介绍如何使用它的模态框功能
工具/原料
1
电脑
2
bootstrap框架的相关资源
下载bootstrap
2
除了直接下载使用还可以使用BootCDN，使用 BootCDN 提供的免费 CDN 加速服务（同时支持 http 和 https 协议）
解压下载包
1
把下载好的压缩包解压，里面有三个文件夹，分别是css、js、font，我门在使用的时候可以直接把这个文件夹复制到项目的根目录，也可以分别把这三个文件夹放入，但是要在同一级目录，因为css里面引用font文件的时候如果不在同一级目录会引用不到
2
这里样好说明一下，在使用bootstrap前必须要引入jQuery，如果没有jQuery必须的下载，因为bootstrap.js是依赖于jQuery的
引入文件编写
1
首先我们引入所需要的文件：bootstrap.css、bootstrap-theme.css、jQuery.js、bootstrap.js
2
引入以后我们就可以编写了，下面我门开始编写一个模态框，bootstrap中的模态框使用的是class为modal,然后它包括头部，内容部分和底部三个部分，我们可以逐一设置，头部和尾部也可以不设置，代码如下
测试效果
1
然后我们写一个按钮，点击用来显示模态框，显示模态框这里使用了modal('show')这个方法，具体的代码如图
2
运行代码，然后点击按钮的效果如图显示，到这里一个简单的模态框就完成了，我们可以根据自己的需求在三个部分添加不同的内容和组件
注意事项
注意jQuery和bootstrap的引入顺序，jQuery在bootstrap之前