Html 幻灯片动画的问题

我是一个没有太多CSS经验的开发人员。我想创建一个纯CSS3幻灯片使用两个图像。我找到了这样做的方法，并在下面实现了一个非常微小的变化（基本上我只是取出了

img.top的
#cf3
id选择器）：

第一个图像被定义为
。第二个相同，只是没有
“top”
类

当我加载页面时，我的所有其他CSS都可以工作，但是没有找到动画。有人看到我哪里出错了吗
 您需要添加特定于供应商的属性名称，这仍然是一个规范草案

-webkit-animation-name: cf3FadeInOut;
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 10s;
-webkit-animation-direction: alternate;

-moz-animation-name: cf3FadeInOut;
-moz-animation-timing-function: ease-in-out;
-moz-animation-iteration-count: infinite;
-moz-animation-duration: 10s;
-moz-animation-direction: alternate;

-o-animation-name: cf3FadeInOut;
-o-animation-timing-function: ease-in-out;
-o-animation-iteration-count: infinite;
-o-animation-duration: 10s;
-o-animation-direction: alternate;

animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 10s;
animation-direction: alternate;

/* and all the keyframes too */
@-webkit-keyframes cf3FadeInOut { ... }
@-moz-keyframes cf3FadeInOut { ... }
@-o-keyframes cf3FadeInOut { ... }
@keyframes cf3FadeInOut { ... }

-webkit-animation-name: cf3FadeInOut;
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 10s;
-webkit-animation-direction: alternate;

-moz-animation-name: cf3FadeInOut;
-moz-animation-timing-function: ease-in-out;
-moz-animation-iteration-count: infinite;
-moz-animation-duration: 10s;
-moz-animation-direction: alternate;

-o-animation-name: cf3FadeInOut;
-o-animation-timing-function: ease-in-out;
-o-animation-iteration-count: infinite;
-o-animation-duration: 10s;
-o-animation-direction: alternate;

animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 10s;
animation-direction: alternate;

/* and all the keyframes too */
@-webkit-keyframes cf3FadeInOut { ... }
@-moz-keyframes cf3FadeInOut { ... }
@-o-keyframes cf3FadeInOut { ... }
@keyframes cf3FadeInOut { ... }