关于CSS动画@-webkit-keyframes的两种实现方式

1、非hover样式：

2、带hover样式

3、解析：

@keyframes(关键帧)作为CSS3动画的一部分，其该紧跟一个标识符(由开发者自定)，此标识符将在其他CSS代码中引用。

在@keyframes和标识符之后，就是一系列的动画规则(就像普通的CSS代码中声明的style规则)了。

这一系列动画规则用大括号括起来隔开，然后再嵌在@keyframes之后的大括号里，类似其他@语法规则。

webkit表示这个动画效果只适用于webkit内核的浏览器。

mycolor1和fade就是这两个动画例子里面关键帧的名字(animation-name)。0%和100%表示这个动画从开始到结束。

4、扩展：动画旋转例子

5、完结。-------------------------------------------------------------------------------------------------------------