前端女娲补天 CSS（八） css过渡，变换和动画有哪些属性

过渡

transition（复合属性），参数有：
property：参与过渡的属性，none | all | property（元素名）
duration：过渡时间
timing-function：过渡动画类型, ease（默认 0-慢-快-慢） | linear（匀速） | ease-in（慢-快） | ease-out（快-慢） | ease-in-out（慢-快-慢）
delay：延迟时间

变换

transform（复合属性）

2d

rotate（2d旋转）：单位度数deg，正顺时针，负逆时针
translateX和Y（平移）：单位px，百分比（自身长宽）
skewX和Y（扭曲变形）：单位deg
scaleX和Y（缩放）：单位正数，默认1，0.01-0.99缩小，1以上扩大

3d

rotateX，Y和Z：单位度数deg，XYZ轴上的旋转角度
translateX，Y和Z：单位px，百分比，在XYZ轴平移
scaleX，Y和Z：单位正数，XYZ轴缩放
perspective（景深，实现近大远小）：单位px，越大近处看起来越大

动画

@keyframes animationname{
from{transform：…}
50%{transform：…}
to{transform：…}
}
animation：name duration timing-function delay