CSS3 Animations；アニメーション - CSS3ウェブブラウザ実装メモ - 血統の森 web実験小屋coding かつては4ブラウザの接頭辞を含めなければ動作しないという、スタイルシートがとんでもなく冗長になるということがあったが、2013年6月時点での実装では、webkit/blinkのみ接頭辞を用意すれば良い。 @keyframesの後にキーフレーム名を記述し、アニメーション変化の仕方を記述する。0%が始点、100%が終点となる。それぞれエイリアスでfromとtoのキーワードが用意されているが、今回のサンプルでは用いていない。 自然にループさせるために、0%と100%に同じプロパティを用意し、50%に変化させるプロパティを記述した。また、:hover擬似クラスでマウスを置いたときにアニメーションが開始するように仕向けておき、animation-iteration-count: infinite;として、無限ループするようにしてある。animation-nameで@keyframesで
