1、Bootstrap框架：

UI组件库：提供了HTML/CSS/JS - 类似于我们学过jQueryUI
不需要任何的记忆，只需要查看文档：https://v3.bootcss.com/
简洁、直观、强悍的前端开发框架，让web开发更迅速、简单。
Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发【响应式布局】、移动设备优先的 WEB 项目。

2、Bootstrap由5部分组成：

1、入门 - 下载
2、全局css样式
3、组件
4、js插件
5、定制

3、想要使用bootstrap一定要记得引入：

	<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
	<script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>

4、全局css样式：分为了2个部分

1、提供了css reset - 如果你引入了bootstrap.css，不需要自己去重置样式
2、提供了大概1000+的class - class带有样式
3、提供了哪些有用的和没用的
	1、按钮：
	     *有用的：1、btn btn-default;//白底黑字的按钮
		     2、btn-block;//块级按钮
	     没用的：五种颜色（btn-danger/warning/success/info/primary） 和 四种大小(lg/md/sm/xs)

	2、图片：
	     *有用的：1、img-rounded; - border-radius: 6px;
		     2、img-circle; - border-radius: 50%;//这两个class不是只有图片能用

	     没用的：缩略图：img-thumbnail;

	3、文本：
	     *有用的：文本对齐方式：text-right/center/justify

	     没用的：五种文字颜色（text-颜色），五种背景颜色（bg-颜色）

	4、*表格 - 很强，但是表格用得少
	     1、table - 长得像个表格
	     2、table-striped - 隔行变色
	     3、table-hover - 带有悬停效果
	     4、table-border - 带有边框
	     5、table-condensd - 紧缩型表格
	     6、table-responsive - 响应式表格，必须设置在table的父元素身上

	5、*表单 - 直接梭，填空修改

	6、栅格式布局 - 重要

5、组件：

1、推荐：
   1、导航条 
   2、巨幕 - banner
   3、缩略图 - 图片文字上下，图文并茂 - 产品
   4、媒体对象 - 左边或者右边放图片，另一边放文字 - 公司简介
   5、面包屑导航/路径导航

2、没用：
   1、字体图标
   2、按钮组
   3、分页条
   4、标签
   5、徽章
   6、页头
   7、警告框
   8、进度条
   9、well水井

6、插件：梭

7、栅格式布局：使用步骤：10步

1、必须放上一个容器：
	<div class="container/container-fluid"></div>
2、必须在此容器中放入行：
	<div class="row"></div>
3、必须在此容器中放入列：
	<div class="col-*-*"></div>
4、在不同的屏幕设置不同的列宽
	col-lg/md/sm/xs-*
5、列宽：bootstrap将一行等分为了12份
	col-屏幕-列宽（1-12）
6、更小的屏幕设置列宽可以管住更大屏幕
	lg - 只能管lg屏幕
	md - 只能管lg/md屏幕
	sm - 只能管lg/md/sm屏幕
	xs - 管所有
	自己有，优先用自己的，自己没有优先用离自己近的
7、设置偏移：设置向左顶出几份
	col-屏幕-offset-列宽
	lg - 只能管lg屏幕
	md - 只能管lg/md屏幕
	sm - 只能管lg/md/sm屏幕
	xs - 管所有
	自己有，优先用自己的，自己没有优先用离自己近的
8、设置在某个屏幕隐藏：只管自己屏幕，不管别人
	hidden-屏幕
9、不推荐：列中可以继续嵌套行，一行又会分为12份，如果列太小了，什么都放不下
10、栅格式布局是一个怪异盒模型：设置间距要用border

始终不可少的步骤： 1、梭 2、改 3、数据渲染

响应式项目必不可少的东西：

1、meat viewport元标签 - 如果缺少，手机端看不到手机端应有的效果，只能看到离自己最近的那个端的效果
2、媒体查询必不可少
3、千万不要使用绝对单位，要使用相对单位：rem
4、响应式图片：max-width: 100%;

不是所有的网站都适合做成响应式网页：比如：电商类;