#1 2D
#2 平移
transform:translate(20px); /* 向右移动20px */
transform:translate(20px,20px); /* 向右且向下都移动20px */
transform:translate(-20px,-20px); /* 向左且向上都移动20px */
transform:translateX(-20px); /* 向左移动20px */
transform:translateY(-20px); /* 向上移动20px */
#3 旋转
transform:rotate(60deg); /* 顺时针旋转60度 */
transform:rotate(-60deg); /* 逆时针旋转60度 */
transform:rotate(-3turn); /* 逆时针旋转3圈=360*3 度 */
#4 缩放
transform:scale(1.1); /* 宽高都放大1.1倍 */
transform:scaleX(1.1); /* 宽放大1.1倍 */
transform:scaleY(1.1); /* 高放大1.1倍 */
transform:scale(1.1，1.2); /* 宽放大1.1倍，高放大1.2倍 */
transform:scaleY(0.5); /* 宽高是原来的一半 */
#5 倾斜
transform:skew(45deg); /* X轴倾斜45度 */
transform:skewY(45deg); /* Y轴倾斜45度 */
#6 过渡
transition-property:transform或all; /* 给哪个属性加过渡效果 */
transition-duration:1s; /* 整个动画耗时1秒完成 */
transition-timing-function:linear; /* 时间曲线：线性(匀速) */
transition-delay:500ms; /* 等待500毫秒再执行动画 */
#7 组合
transition:transform 1s linear 500ms;