Bootstrap
css框架框架：就是一些文件，css类型，js类型，就是常见的css或者是js代码，在开发网页的过程中，会有许多操作或者是样式重复使用，那么就将这些重复使用到的代码集合到了一个文件里面，假如开发者想用此功能或者此样式，就直接导入这个文件，直接进行使用。
死代码：僵尸代码，就是代表的一个意思
Bootstrap里面放置了很多的常用的样式，只需要直接调用类名就行Bootstrap支持响应式布局的框架
响应式布局：当进行浏览器窗口的放大缩小的时候，还能完整地看到里面的内容
百度：半响应式
淘宝京东这样的大型网站为什么不做成响应式：
1.内容太多，展示的商品特别多，用户体验不好
2.适配各种手机的屏幕
3.开发过程很是繁琐，都得考虑兼容性，不容易维护
4.用户体验：消耗流量
大型网站单独给手机端做了一个网站
列如（m.taobao.com）,mobile
适合做成响应式的：阅读性的网站Bootstrap其实是以移动端优先的框架（栅格系统）bootstrap的官网：www.getbootstrap.com
Bootstrap三部分：样式，组件,js插件
Boostrap内容：
css：设置样式
fonts:设置字体
js:js操作，js插件，必须结合jQuery使用
github网站：可以进行框架的下载，也可以在里面分享自己所写的内容Bootstrap
用法：
1.必须先在html文件里面外链bootstrap.csslinkbootstrap.css:相当于我们自己写的css文件，样式，注释，空格
bootstrap.min.css:经过压缩的css文件，只有样式，没有注释也没有空格，文件比较小，占内存空间小，用户体验，流量消耗
CDN:内容分发网络，将文件放入到服务器目录下面，直接将url地址放入到link里面就可以直接进行框架的使用（必须得有网）
CDN好处：快速，有缓存，流量
2.进行类名的设置排版：
1.标题h1--h6:和原来的样式有些不一样，还提供.h1--.h6的使用
2.副标题(small)：放置在h级标签里面使用
3.页面主体：只要使用了bootstrap，那么body里面的文字大小默认为14px,字体类型 Helvetica Neue ，line-height是 1.428571434.
中心内容：.lead,使段落突出显示
5.mark标签: 使文字高亮
6.删除线：del
7.无用文本：,也是删除线
8.下划线：ins u
9.小号文本：,将字体大小变为85%,将small标签加入h级标签里面使用的时候，会额外地添加一些样式
10.字体加粗：strong
11.斜体: em
12.对齐：.text-left,.text-right,.text-center,.justify,text-nowrap
13.文字大小写
（text-transform）:.text-uppercase: 全部大写
.text-lowwercase：全部小写
.text-capitalize:首字母大写
14.缩略语： ,结合title属性使用
15.首字母缩略语：.initialism,缩略语的文字变小
16.地址：address，将地址放入标签里面
17.引用：blockquote，在标签里面放入p标签代表引用的内容，样式为居中显示
18.列表:在列表里面加入.list-inline,就可以使列表项在一行显示.list-unstyled: 列表没有默认样式代码：
1.:和mark效果是一样的，使内容高亮，一般用来使某个代码高亮
2.:原型输出，和以前用法一样，可以在里面放置许多代码表格：
1.去掉了一些默认样式，边距
2.在table标签里面加上.table
3.加上表格的边框线：.table-bordered
4.鼠标移入到表格的哪行：.table-hover
5.有关于表格的许多效果都只在tbody里面生效
6.条纹状表格（斑马线）：.table-striped
7.紧缩表格，将表格的padding缩小：.table-condensed
8.状态类表格，给每一行单元格设置不同的状态.active: 激活状态
,斑马线表格的颜色
.success: 成功状态,浅绿色
.info:显示信息,浅蓝色
.warning:标识警告
.danger:标识危险
9.响应式表格：默认为就是响应式的，将.table加入到.table-responsive元素里面，在没有bordered的情况下，给表格增加了上面和下面的线，用来标识表格的范围图片：
1.响应式图片：.img-responsive
2.图片的形状：
圆角框：.img-rounded
圆形：.img-circle
缩略图：.img-thumbnail(多上一个边框)
按钮：button,a(input type="button",在IE8里面存在兼容性问题)
1.必须给button标签写上.btn类
2.默认样式：.btn-default
3.在a标签里面使用role属性，告知此标签是用来做什么的，SEO
4.button标签在表单里面会触发提交的操作。
5.使用了类只是改变了样式，并不能改变其原有的操作
6.样式：首选项，btn-primary
7.成功：btn-success
8.信息：btn-info
9.警告：btn-warning
10.危险：btn-danger
11.链接：btn-link
12.最大尺寸：btn-lg
13.小尺寸: btn-sm
14.超小尺寸：btn-xs
15.转化为块级元素：btn-block,宽度是button父元素的宽度
16.button的激活状态：.active
17.button的禁用状态：设置disabled属性
18.隐藏元素的样式：.sr-only
辅助类：1.情景颜色：文本的：.text-状态的单词（success,primary,info,warning,danger）
按钮的：.
btn-状态单词背景颜色：.bg-状态的单词
2.关闭按钮：给button设置.close,可以关闭模态框和警告框，关闭按钮的实体字符(×)
3.三角框，一般用来做下拉列表右边显示的部分：.caret,一般加在行内元素里面(span,i)
4.快速浮动：.pull-left:左浮动.pull-right:右浮动
5.清除浮动.clearfix6.居中显示：.center-block
7.显示：.show(display:block)
8.隐藏：.hidden屏幕阅读器：屏幕的阅读软件，可以将屏幕上的文字，图片，视频之类的内容以阅读出来。
.sr-only这个类对屏幕阅读器无效，.hidden是支持屏幕阅读器表单：
1. .form-control： 表单控制类，加了此样式，就能看到bootstrap里面的表单样式了，宽度是100%
2.将label和表单控件都放置在一个.form-group里面，可以获得更好的排列
3.内联表单：在form标签里面设置.form-inline，可以使表单里面的元素共处一行显示
4.form-block: 块级表单,每个元素独占一行显示
5.一定要将label标签放于表单控件一起写，是为了防止屏幕阅读器不能正确地识别表单元素
6.label的隐藏使用sr-only，要保证屏幕阅读器能识别，并且在界面上显示不出来此提示内容7.aria-* 不需要去管，还是为了让屏幕阅读器识别
8.如果以上属性不存在，可以在控件里面写上placeholder
9.如果要讲输入框和其他元素放置在一起显示，则需要将这些元素都放置在.input-group
10.栅格系统：将浏览器窗口分为了12等份
11.表单控件的type属性必须得写
12.如果要使控件不能点击，则设置.disabled类
13.单选按钮和复选框的用法都是一样的，将控件与选择的文字放置同一个label标签里面，再将label放置在有.checkbox或者.radio的类里面