1.浏览器的渲染原理
1.根据HTML构建HTML树（DOM）
2.根据CSS构建CSS树(CSSOM)
3.将两棵树合并成一颗渲染树（render tree）
4.layout布局（文档流、盒模型、计算大小和位置）
5.paint绘制（把边框颜色、文字颜色、阴影等画出来）
6.Compose合成（根据层叠关系展示画面）
transition和animation和区别
animation可以用name设置动画的名称，用duration设置动画完成的周期，用timing-function设置动画的速度曲线，delay设置动画什么时候开始，iteration-count设置动画播放的次数，direction规定下一个周期是否逆向播放，play-state动画是否正在进行或暂停
transition用property去设置过度效果的属性名称，duration设置过渡效果的周期，timing-function规定速度效果的速度曲线，delay设定过渡效果什么时候开始;
区别
1.transition是过渡，是样式值的变化的过程，只有开始和结束；animation其实也叫关键帧，通过keyframe结合可以设置中间帧的一个状态; 2.animation配合@keyframe可以不触发就有效果，而transition需要通过hover或者js事件来配合触发; 3.animation可以设置很属性，循坏次数,而transition只能触发一次。
