动画Animation常⽤属性查询四六级成绩
动画就是由⼀个个的关键帧组成的。同济大学自考
词组想实现⼀个动画的效果，这个时候
1.需要先预设⼀个动画
@keyframes cc {connecticut
/* 动画序列：时间节点 */
/* 开始状态 */
/* 节点设置 */
/* 写CSS属性 */
身份证翻译from {
transform: translateX(0px);
}
cret是什么意思/* 结束状态 */
to {
transform: translateX(500px);
}
描写家乡景色的作文/* ************************************百分数 */
0% {
/* 节点设置 */
/* 写CSS属性 */
transform: translateX(0px);
}
777050% {
transform: translateX(800px);
}
100% {
/* 注意点：节点状态⼀定是在上⼀个节点状态上进⾏ */
transform: translateX(800px) translateY(600px);mirror是什么意思
}
}
百分⽐指的是动画耗时（animation-duration）的时间⽐
2.设置动画属性
先来⼀个综合写法
animation: name duration timing-function delay iteration-count direction fill-mode;
其中两个必要的属性就是
1.animation-name：cc; 你⽤@keyframe设置的动画的名字
2.anmation-duration：3s； 动画耗时
3.animation timing-function ：运动速度
默认属性ea（低速开始，加快，低速结束） linear（匀速运动） ea-in（低速开始）
ea-out（低速 结束 ）ea-in-out 低速开始和结束 steps（n）动画分成n步来完成
4.animation-delay ：2s； 延迟时间
5.animation-interation-count：2/infinite（⽆限次） 动画响应的次数（interation英⽂意思相互影响）
6.animation-direction: 循环⽅向
默认normal(默认0~100) / alternate(0~100~0)/ rever(100~0)/
alternate-rever(100~0~100)
7.animation-fill-mode 动画等待或者结束时候的状态
剪刀差forwards 初始状态不能⽴即执⾏0%的状态，执⾏动画完成后保留最后状态
backwards 如在0%时候设置样式，⽴即执⾏。动画完成后不会保留最后的结果（有延迟） both 既能⽴即执⾏设置的样式，也会保留最后的结果。
8.animation-play-state （不在简写内） 播放和暂停状态 paud暂停 running 播放
3.组动画 ，让⼏个动画同时执⾏
animation: name_1 5s linear,name_2 2s linear 两个动画之间⽤逗号隔开
