一、单位
1、px是基本的单位，像素
2、em也是一个单位，使用方式，用元素父级的字体大小乘以em前的数字，父级没有就向上一个父级找，
直到body为止，如果body没有，就用默认的字体大小16px
3、rem是一个单位，只跟根节点<html>的字体大小有关，如果根节点没有字体大小，默认16px
4、line-height：2；则此元素的的行高为2X元素的字体大小
二、浏览器
浏览器与浏览器之间的差距重要体现在浏览器自身的内核
每个浏览器都有自己的前缀，这个主要是解决css3中的兼容问题
Chrome（谷歌）前缀 -webkit-
Firefox（火狐）前缀 -moz-
IE的前缀 -ms-
opera（欧朋）的前缀 -o-
国内浏览器的内核都是谷歌
三、布局
1、流式布局 float+margin
2、定位
3、双飞翼
4、圣杯
5、弹性盒子布局，移动端布局常用
全称：弹性和模型 用父级的弹性容器和子级的弹性子元素两者构造
display：flex；这个属性决定谁是弹性容器，它里面的元素就是弹性子元素
flex是弹性元素在弹性容器中所占的份数，属性值是数字
6、表格布局
父级：display：table；
子级：display：table-cell；
7、box-sizing:border-box;
这个属性的作用是 几遍此元素设置了padding和border，只能向内挤压，而元素的可利用空间会变少
则元素的实际宽度就等于元素设置的width