css动画渐变

动画，在我们进行开发项目的时候也是很常见的，特别是在一些漫画网站和一些商业网站等等都可以看到动画的出现，制作动画的方法有很多种，而用哪一种方法也主要是看需求，

那么接下来我们将用css3来制作动画，而制作这个动画的主要是运用css3里面的keyframes（关键帧）来制作。对于keyframes（关键帧），其实类似于Flash中的关键帧 ，但和Flash中的关键帧不同的是，在css3中以@keyframes开头，然后写上名称再以花括号来书写样式和一些规则。

接下来将时候使用keyframes（关键帧）制作一个可以自动切换的简单的动画。
实现的效果是在div里面的图片可以自动切换，同时，切换的效果渐变。

第一张图：

第一张图片向第二张过渡：

第二张完全显示：

实现的代码很也是很简单的，主要还是调用keyframes来实现这个效果

值得注意的是，写好keyframes里面的样式之后一定要记得在要实现的地方添加上
animation，他的作用主要是用来调用 @keyframes 定义好的动画。而且动画的名称一定要一致，否则无任何效果。
这样就利用keyframes完成了一个可自动切换的动画。