Пример
@keyframes anim { from {margin-left:3px;} to {margin-left:500px;} } #wrap1 { animation:anim 4s 3; }
Обратите внимание: данное свойство поддерживается в браузерах IE10+, Firefox и Opera. Для браузеров Chrome и Safari требуется префикс -webkit.
С помощью свойства @keyframes Вы можете создать анимацию.
Оформление элемента во время выполнения анимации может устанавливаться с помощью ключевых слов from (оформление элемента в начале анимации) и to (оформление элемента в конце анимации).
Более точно оформление можно задать с помощью % (0% - оформление элемента в начале анимации, 100% - оформление в конце анимации).
При определении анимации сразу после свойства @keyframes должно следовать имя данной анимации (данное имя затем должно быть указано в свойстве animation элемента, который будет анимирован).