1. transform transtion translate的区别
- transform：css3移动属性
- translate： 位置移动的方法 表示当前位置的偏移量 translate(X,Y) translate3D(X,Y,Z)
- transition：css3过渡属性 表示从一种状态到另一种状态过渡的方式 transition: property duration timing-function delay;
2.盒子模型
什么是盒子模型？
- 盒子模型是由padding margin border content构成的盒子
一个盒子的大小怎么计算？
- border+content+padding
boxsizing： content-box/border-box的区别？
- content-box: 标准盒模型
- border-box： 怪异盒模型 固定盒子大小 content会被压缩
3.选择器优先级
权重的等级？
- important 10000
- 内联 1000
- ID 100
- 属性选择器 类选择器 伪类选择器 10
- 标签选择器 伪元素选择器 1
- 通配符 关系选择器 0
选择器优先级怎么计算？
内联 > ID > 属性 > 标签 依次 （a, b, c, d）表示
li /* (0, 0, 0, 1) */
ul li /* (0, 0, 0, 2) */
ul ol+li /* (0, 0, 0, 3) */
ul ol+li /* (0, 0, 0, 3) */
h1 + *[REL=up] /* (0, 0, 1, 1) */
ul ol li.red /* (0, 0, 1, 3) */
li.red.level /* (0, 0, 2, 1) */
a1.a2.a3.a4.a5.a6.a7.a8.a9.a10.a11 /* (0, 0, 11,0) */
#x34y /* (0, 1, 0, 0) */
li:first-child h2 .title /* (0, 0, 2, 2) */
#nav .selected > a:hover /* (0, 1, 2, 1) */
html body #nav .selected > a:hover /* (0, 1, 2, 3) */
从左到右进行比较 数值大者优先级较高
