Aula de animações em CSS.
Correção em 6:02: na verdade o backwards significa que o elemento assume as propriedades do primeiro frame *enquanto estiver em delay, antes de começar a animação*, e não ao final (como é o caso do forwards). Como o exemplo não tinha delay, não deu para ver o efeito.
Material em texto: http://webacademico.canoas.ifrs.edu.b...
Real-Time HTML Editor: https://htmledit.squarefree.com/
0:00 - Introdução
0:35 - @keyframes (from, to)
1:20 - animation (name, duration)
2:52 - Aceleração (timing-function, ease, ease-in, ease-out, ease-in-out, linear, steps)
3:33 - Repetições (iteration-count, infinite)
3:58 - Direção (direction, normal, reverse, alternate, alternate-reverse)
4:36 - fill-mode (forwards, backwards, both)
6:15 - Exemplo com transform