响应式布局

响应式

1. 版心、导航（导航抽屉）、样式等，会随着视口缩放而变更不同的效果。

2. @media 媒体查询：

link引入媒体查询时，不建议写screen屏幕、print打印机、speech阅读器、all多有。

<link rel="stylesheet" media="媒体类型 逻辑词（媒体特性）" href="xx.css">

BootStrap

概述：

• • Bootstrap 是由 Twitter 公司开发维护的前端 UI 框架，它提供了大量编写好的 CSS 样式，允许开发者结合一定 HTML 结构及JavaScript，快速编写功能完善的网页及常见交互效果。
• • 中文官网: www.bootcss.com/
• • 引用bootstap.css

• • 引入BootStrap样式，与引入js文件：jQuery.js + BootStrap.min.js

1. 栅格系统布局，bootstrap3默认将网页分成12等份。

2. disabled 按钮禁止状态属性。

3. 封装源代码不可更改，可以添加类名，在同权重等级下修改。这样避免了后面使用同类型的样式时被覆盖的问题。

4. .myol 中的子代li + li ，选中除第一个li以外的所有li。

5. object-fit : cover ; 图片以中心为主，按父盒子的宽高等比例缩放，超出部分被裁减。