Keyframes CSS3 - анимация на практике

Опубликовано: 04 Май 2015
на канале: CodexWeb (бывший Master-CSS)

60,077

2.8k

ВНИМАНИЕ! Запуск Луны на орбиту Земли начинается :))) Приглашаю на борт!

В этом уроке мы разберем на практике следующие свойства:

1. animation - указывает название анимацию, и другие характеристики (время, тип, повтор, задержка и т.д.)

2. @keyframes - правило, в котором создается анимация, и запускается, путем задания силектору свойства animation.

3. background-size - управляет размером фона, можно прописать свои размеры, можно указать, чтобы фон растягивался по максимальной ширине родителя, или сжимался (полностью вмещаясь в родитель).

Так же разберем префиксы keyframes и animation. Ну и... запустим анимацию вращения луны вокруг земли, смотрите пример ниже:

http://master-css.com/demo/orbita/

==============================================

Ссылка на архив: http://master-css.com/zip/orbita.rar

** Заработай на своем YouTube канале **
http://master-css.com/go/21

Музыка предоставлена сайтом http://audiomicro.com, как партнеру VSP Group. Спасибо!
Наш сайт: http://master-css.com
Наш ВК: https://vk.com/m_css
Мой Twitter: / swat727
Google+ https://plus.google.com/+Master-css/