How Define Animation?

we can define animation an several ways.
by using in @keyframes we declare in the element animation-name: and animation-duration:; and in now section define the @keyframes using in some name. define frames and in every frame how we want the elelment look.
we can use in from:, to: keywords, then define only 2 frames (start and end). or using percent like this @keyframes{0%{} 25%{} 70%{} 100%{}}