Интенсивный курс «Продвинутый HTML и CSS»27 февраля — 2 апреля 2017
Анимация

Анимация

Рассмотрим основы анимации на CSS. Нам предстоит пройти путь развития цивилизации и покорить космический простор. Мы будем двигать, поворачивать и видоизменять объекты, попутно осваивая приёмы работы анимации в CSS.

Начать

Привет, animation!@keyframes: раскадровка@keyframes: from и to@keyframes: группировка кадров

Следующие задания доступны по подписке
Оформите подписку, чтобы пройти этот и другие платные курсы целиком.
Подписаться

Множественная анимация, шаг 1
Множественная анимация, шаг 2
Водное путешествие
Количество проигрываний анимации: animation-iteration-count
Направление анимации: animation-direction, шаг 1
Направление анимации: animation-direction, шаг 2
Задержка начала анимации: animation-delay, шаг 1
Задержка начала анимации: animation-delay, шаг 2
Задержка начала анимации: animation-delay, шаг 3
Воздушное путешествие
Состояние до и после анимации: animation-fill-mode, шаг 1
Состояние до и после анимации: animation-fill-mode, шаг 2
Состояние до и после анимации: animation-fill-mode, шаг 3
Состояние до и после анимации: animation-fill-mode, шаг 4
Состояние до и после анимации: animation-fill-mode, шаг 5
Запуск фабрики, шаг 1
Запуск фабрики, шаг 2
Остановка и запуск анимации: animation-play-state
«Форма» анимации, animation-timing-function
animation-timing-function, шаг 2
animation-timing-function, шаг 3
animation-timing-function, шаг 4
Ракета на старт, шаг 1
Ракета на старт, шаг 2
Посадка, шаг 1
Посадка, шаг 2
Посадка, шаг 3