Too Long; Didn't Read
Before CSS3 it was really difficult to achieve some sort of animation without javascript. And now we can get beauty animations just with plain CSS and HTML. The keyframes are the main blocks to build an animation. Inbetweening is the process of generating intermediate frames between two images, called key frames, to give the appearance that the first image evolves smoothly into the second image. The more inbetweeners frames you draw in the same period, the more smooth the animation will be. The main difference between animation and animation properties is that animation allows us to manage more than 2 states.