定義と使用法
いくつかのCSS特性は、それらがアニメーションやトランジションで使用することができることを意味し、 アニメーション化されています。
アニメーションのプロパティはサイズ、数、割合と色のように、別の値から徐々に変化することができます。
ブラウザのサポート
表中の数字は完全にCSSアニメーションをサポートする最初のブラウザのバージョンを指定します。
-webkit-続い番号、-moz-、または接頭辞で働いていた最初のバージョンを指定して-O-です。
4.0 -webkit- | 10.0 | 16.0 5.0 -moz- | 4.0 -webkit- | 15.0 -webkit- 12.1 12.0 -O- |
例
赤から青に背景色をアニメーション:
/* 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;}
}
»それを自分で試してみてください アニメーションのプロパティ
これらのプロパティは、CSSでアニメーション可能です。