css3动画

2D变形：平移、旋转、缩放、倾斜

transform: translate()平移

transform: translate(x,y) 沿着x轴和y轴移动

transform: translateX(x) 沿着x轴移动

transform: translateY(y) 沿着y轴移动

取值:

px

百分比（强调相对于元素本身计算）

说明：允许负值，正值默认向右向下，负值向左向上

 transform: rotate(ndeg) 旋转

语法

transform：rotate(deg);沿着中心点旋转，默认值

transform: rotateX(deg);沿着X轴旋转

transform: rotateY(deg);沿着Y轴旋转

单位：deg ​ 当角度值为正数时，元素沿着顺时针方向旋转 ​ 当角度值为负数时，元素沿着逆时针方向旋转

transform: scale() 缩放

transform: scale(x,y) 沿着x轴和y轴缩放

transform: scaleX(x) 沿着x轴缩放

transform: scaleY(y) 沿着y轴缩放

transform: skew() 倾斜

transform: skew(x,y) 沿着x轴和y轴倾斜

transform: skewX(x) 沿着x轴倾斜

transform: skewY(y) 沿着y轴倾斜