CSS Анимационные свойства
Определение и использование
Некоторые свойства CSS являются animatable, что означает, что они могут использоваться в анимациях и переходах.
Свойства анимации могут постепенно изменяться от одного значения к другому, например размер, число, процент и цвет.
Поддержка браузерами
Числа в таблице указывают первую версию браузера, которая полностью поддерживает CSS-анимацию.
Числа, за которыми следуют -webkit-, -moz- или -o- указывают первую версию, которая работает с префиксом.
| 43.0 4.0 -webkit- |
10.0 | 16.0 5.0 -moz- |
9.0 4.0 -webkit- |
30.0 15.0 -webkit- 12.0 -o- |
Пример
Анимировать цвет фона от красного до синего:
/* Код для старых Chrome, Safari и Opera */
@-webkit-keyframes mymove
{
from {background-color: red;}
to {background-color: blue;}
}
/* Стандартный синтаксис */
@keyframes mymove
{
from {background-color: red;}
to {background-color: blue;}
}
Попробуйте сами »
Свойства анимации
Это свойства анимации в CSS:
