在软件开发过程中，即便是后端开发工程师，也会多多少少接触一些前端框架，所谓前端框架一般指用于简化网页设计的框架，比如，jquery，bootstrap等等。目前bootstrap和layui是比较火的前端框架，layui我之前介绍过，今天我就介绍介绍bootstrap可以干什么？如何使用bootstrap?
01 Bootstrap介绍？
关于Bootstrap，官方是这样介绍的：Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。这句话中，重点在于响应式以及移动设备优先。
所谓"响应式布局"，就是你的网站和应用能在 Bootstrap 的帮助下通过同一份代码快速、有效适配手机、平板、PC 设备，这一切都是 CSS 媒体查询（Media Query）的功劳。
除了响应式和移动设备优先，Bootstrap还提供了非常多的组件，比如表单、按钮、下拉菜单、输入框组、提示框、图标等，都是拿来即用并且使用效果非常好。
所以，前端框架中，Bootstrap是非常值得学习的。目前，BootStrap总共分为四个版本，从bootstrap1到bootstrap4，其中bootstrap4版本由于发布时间不长，官方网站正在将英文版本翻译为中文版本，所以我建议初学者先学习bootstrap3版本，用的比较熟练后，通过看bootstrap4的官方文档就可以轻松学会bootstrap4版本。
02 如何使用BootStrap?
关于使用如何bootstrap，你只需要把bootstrap相关的js文件、css文件下载到本地就可以使用，由于bootstrap是基于jquery设计的，所以在引入bootstrap.js文件前，要先引入jquery.js。
下载bootstrap的三种常用方法
方法一：到官网下载zip压缩包（链接地址https://www.bootcss.com/）
bootstrap/
├── less/ //css源码
├── js/ //js源码
├── fonts/ //字体源码
├── dist/ 预编译过的bootstrap文件
│ ├── css/
│ ├── js/
│ └── fonts/
└── docs/
└── examples/ //官方说明文档
解压从官网下载的压缩包后，将dist目录下的bootstrap.css和bootstrap.js引入到HTML中即可。
bootstrap入门
hello bootstrap
bootstrap.min.css、bootstrap.min.js为压缩包，取消了换行符，体积更小，建议线上使用，线下调试建议使用完整版
方法二：CDN引入（有网络的情况下）
CDN引入比较简单，直接到官网复制CDN地址，在head标签中引入即可
bootstrap
hello bootstrap
方法三：Bower、npm或者Composer工具安装（什么是npm?）
附各版本jquery下载地址：http://www.jq22.com/jquery-info122
至此，使用bootstrap的准备工作以及完成，接下来就是正式使用bootstrap。
1 普通的HTML文档
bootstrap
2 引入bootstrap的css、js以及jquery.js文件
bootstrap
3 在官网找到相关示例代码
bootstrap
bootstrap情境背景色的使用
i like bootstrap very much!
i like bootstrap very much!
i like bootstrap very much!
i like bootstrap very much!
i like bootstrap very much!
效果如下图
从上面的例子中可以看到，bootstrap的使用主要分为下载、引入两个步骤，具体需要实现什么功能，如按钮、背景色、表单、下拉框等，可以到官网 https://www.bootcss.com/查看相关的说明。