一、今日学习内容
1.rem概念：rem（root em）是一个相对单位，和em不同的是rem相对基准是对于html元素的字体大小来说的
优点：父元素的字体大小可能不一样，但是整个页面只有一个html标签，可以很好的控制整个页面的元素大小。
2.媒体查询：概念：使用 @media 来进行查询，可以针对不同的媒体类型定义不同的样式，也可以根据不同的屏幕尺寸来设定不同的样式
语法规范：
1.用@media 来进行开头；
2.mediatype 媒体类型
all：用于所有的设备
print：用于打印设备或者打印预览
screen：用于电脑屏幕、平板电脑或者手机。
3.关键字 and not only
4.media feature 媒体特性，在小括号中书写
综合写法：@media mediatype and/not/only （media feature）{ css-code}；
3.LESS（CSS预处理器）
优点：比CSS功能更多，增加了程序语言特性。有很好的计算能力，方便拓展复用。
3.1 less嵌套
3.2 less运算
特点：
1.任何的数字、颜色或者变量都可以参与运算
2.基本的运算符有：加（+）、减（-）、乘（*）、除（/）
语法规范：
运算符左右两边要有空格隔开
除法运算需要在运算外加括号，否则不生效
对于两个不同的单位的值之间的运算，运算结果取前面的值的单位
如果两个参与计算的数值，只有一个值有单位，那么就用有单位的值的单位
4.rem适配方案
4.1 less+rem+媒体查询
原理：让一些不能等比例自适应的元素，达到不同的尺寸时，根据html字体的大小变化来用rem作为单位，控制元素进行自适应变化。
rem的实际开发适配方案 设置设计稿宽度——将屏幕划分等份———用rem作为单位控制元素自适应变化
公式：页面元素的rem值 = 页面元素的px值 / html 的字体大小
html的字体大小 = 屏幕的宽度 / 划分的份数
4.2 flexible.js+rem
优点：不需要在写不同屏幕的媒体查询
原理：把当前设备划分为10等份，但是不同设备下，比例还是一致的
二、今日问题
今日未遇到问题，今天学习内容已掌握
|
