I remember that I used animation directly at work, as long as I could make animations, I didn’t pay attention to every detail.
Actually, it is not wrong for us to do this, because we don’t have time to show you every detail at work, and there will be no more content after reading a general article.
When we want to clear things up, I will think of every knowledge point I have seen before. However, there is nothing wrong with doing so, but it is obviously not a wise choice.
I think that when you do something, you have a plan. Only if you plan well, don’t know how to mark it, and slowly solve it one by one later, will you not miss the key points of learning. Okay, I won’t talk anymore, I’m going to sleep.
animation-name is represented as @keyframes animation specified name;
Syntax: animation-name :keyframename|none;
animation-duration represents the time required for the animation to complete a cycle;
Syntax: animation -duration: time;
animation-timing-function indicates the speed of the specified animation (speed);
Syntax: animation-timing-function: value;
What are the values: linear, ease, ease-in, ease-out, ease-in-out, cubic-bezier(n,n,n,n);
animation-fill-mode indicates fill mode;
Syntax: animation-fill-mode: none | forwards | backwards | both;
nimation-delay indicates that the animation is about to start.
Syntax: animation-delay: time;
animation-iteration-count represents the number of times the animation is played;
Syntax: animation-iteration-count:n|infinite (infinite loop);
animation-direction represents Repeat the animation once, or you can move back and forth and repeat.
Syntax: animation-direction: normal|alternate;
animation: name duration timing-function delay iteration-count direction;