css3之2d转换

接下来请记住这几个英文单词
transform
translate
rotate
scale
transition

2d转换

水平或者垂直方向平行移动
2d转换后不会影响其他盒子
沿着x轴活着y轴移动
transform:
translate(X, Y)
translateX()
translateY()

顺时针或者逆时针旋转
transform:
rotate(90deg)

设置转换的中心点
transform-origin: x y
默认 50% 50%

缩放
和通过width,height改动大小的区别是，缩放不影响其他盒子
这里x和y都是缩放倍数
transform: scale(x,y)

动画

动画和过渡的区别
animation
先定义动画，再去使用动画
使用@keyframes定义动画