rem布局
什么叫rem：
root em 是一个相对单位 和我们的em不同的是rem的相对基准是对于hetml的元素
字体大小来说的。
如果根元素html的字体大小font-size ：12px 非根元素设置具体的单位是width：2em
，换算成单位就是24px。
优势：父元素的字体大小可能不一致，但是真个页面只有一个html标签，可以很好的控
制整个页面的元素大小。rem的大小之和html的字体大小有关，和父类的字体大小无关。
媒体查询：
概念：媒体查询是css3的新语法，使用@media来进行查询，可以针对不同的媒体类型定
义不同的样式，也可以根据不同的屏幕尺寸设定不同的样式。
媒体查询的语法规范：
@media来进行开头
mediatype 媒体类型
分类：all 用于所有的设备。print 用于打印机 打印预览
screen 电脑屏幕 平板电脑 手机
关键字可以是and not only
and 且 将多个媒体特性连接在一起
not 非 排除某个媒体类型 可以省略
only 只 指定某个特性的媒体类型可以省略
内容写在media feature 媒体的特性，在小括号中书写
：width定义输出设备中课件区域的宽度
min-width 定义输出设备中页面最小可见区域的宽度
max-width：输出设备最大可见区域的宽度
@media mediatype and/not/only (media fature){
}
less使用
帮助我们更方便的写css
css的弊端：
css是一门非程序式语言，没有变量，函数，作用域这些概念
css的书写会写大量看似没有逻辑的代码，冗余程度比较高。
不方便扩展和复用
css没有很好计算能力
less介绍：
less是一门css的计算语言。也称为css预处理器，作为css的一种形式扩展，并没有减少
css的功能，而且在现有的css的语法上，增加了程序式语言特性。
常见的预处理器：
sass less stylus 等等
less的编译
下载插件easy less
将less文件编译成css文件
less嵌套：
父类嵌套子类
less 的运算
任何的数字、颜色、变量都可以参与运算
基本的运算有加减乘除
除法的话外面要加x小括号
语法规范：
运算符中间左右两边要有空格隔开
对于两个不同的单位的值之间的运算 运算结果取前面值的单位
若果只有其中的一个值有单位 就取有单位那个值的单位
rem的适配方案
1、less+rem+媒体查询
自适应的原理：让一些不能等比例自适应的元素达到不同的尺寸时候，根据html字体的
变化来用rem作为单位，控制元素进行自适应变化。
先以750px为标准
rem的实际开发适配方案
2、flexible.js+rem
script 引入js
|
