1.px 就是一个基本的单位 像素
2.em 也是一个单位 用父级元素的字体大小乘以em前面的数字（案例01.html），如果父级没有就继承上一个父级直到body，如果body没有就默认为16px。
3.rem 也是一个单位，只跟根节点<html>的字体大小有关（案例02.html） 默认值16px。
line-height 行高 line-height：2；行高值 是当前数字2乘以元素字体大小（案例02.html）
二、浏览器
浏览器和浏览器之间是有差距的，这个差距是由浏览器自身内核决定的
每个浏览器都有自己的前缀，主要解决css3中的兼容问题。
Chrome（谷歌）的前缀-webkit Firefox（火狐）的前缀-moz-
le的前缀-ms- Opera（欧朋）-o-
国内的浏览器的内后都是谷歌。
三、布局
1.流式布局 float+margin
2.定位
3.双飞翼
4.圣杯
5.弹性盒子布局 移动端布局
全称叫弹性盒模型：是由父级的弹性容器和子级的弹性子元素两者结构，
display：flex；这个属性决定谁是弹性容器，它里面的子元素就是弹性子元素(案例03.html)
flex 是弹性子元素在弹性容器中所占的份数，属性值是数字
6.表格布局（04.html）
7.box-sizing 这个属性 让元素的实际宽度就等于设置的width 即便有了padding和border 只会向内挤压，元素的可利用空间变小。(05.html)
下拉列表（案例01html）
改变元素的性质的三种方式：position display float
行级元素和行级块元素的margin的上下不起作用了，左右还行
占位：针对标准流来说
元素添加float position 元素不会占位（脱离标准流）
浏览器的差距
浏览器默认字体是16px，谷歌最小字体是12px，其它的都是10px
ie ie7 ie8
hack
hack是针对不同的浏览器去写不同的html，css样式，从而让各浏览器能达到一直的渲染效果
hack两种写法
html的hack：写在html标签中
css的hack：写在css的样式中
&it < &ite<= >> >e>=
css hack
（1）选择器hack 特殊符号写在选择器上
（2）值hack 特殊号写在 属性前面
值 hack
le6 专用符号是-和_短横和下划线
le6和le7 同时专有的的hack 属性前面加！和 + 等
le8专有的hack属性值后分号前加 /
ie 6 7 8 9 10同时专有的是 属性值后号后面加9
选择器
渲染： 渲染是浏览器的一种能力，将图片文字，样式等展现出来
向下兼容：新属性值在高版本浏览器出，向低版本处理的方法