Boostrap

---

一.响应式布局—查看Demo

1.响应式布局的设计原则

- 移动优先

在设计的初期就要考虑页面如何在多终端显示

- 渐进增强

充分发挥硬件设备的最大功能

2.头部声明

栅格系统进行响应式开发,头部设置响应的viewport

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

3.网页开发中的单位：

1. px

   px是相对于屏幕分辨率，大小无法跟随屏幕的放大和缩小，所有浏览器都支持

2. em

   1em=16px(但不完全是,每个浏览器不一样)，em会继承父级元素的字体大小，IE部分浏览器不支持em

3. rem

   rem和em类似,rem会继承根元素的字体大小，html{font-size:62.5%}(稳定)