Definição e Uso
Algumas propriedades CSS são animatable, o que significa que eles podem ser usados em animações e transições.
Propriedades animáveis pode mudar gradualmente a partir de um valor para outro, como tamanho, número, porcentagem e cor.
Suporte a navegadores
Os números na tabela especifica a primeira versão do browser que suporta totalmente animações CSS.
Números seguido por -webkit-, -moz-, ou O- especificar a primeira versão que trabalhou com um prefixo.
4.0 -webkit- | 10.0 | 16,0 5.0 -moz- | 4.0 -webkit- | 15,0 -webkit- 12.1 12,0 -o- |
Exemplo
Animar a cor de fundo de vermelho para azul:
/* Code for Chrome, Safari and Opera */
@-webkit-keyframes mymove
{
from {background-color: red;}
to {background-color: blue;}
}
/* Standard syntax */
@keyframes mymove
{
from {background-color: red;}
to {background-color: blue;}
}
Tente você mesmo " Propriedades animáveis
Estas propriedades são Animatable em CSS: