Html css-动画迭代次数总是无限的。期望1次迭代

我有一个

div

标签覆盖一个图像，该图像通过增加宽度和不透明度来设置动画。我只需要一次迭代（我知道这是默认的），但不管出于什么原因，它都会无限运行。我能得到一些关于如何完成单个迭代的反馈吗？提前谢谢你

标记：

<div class="capback">
</div>

---

俗话说，“问题通常在键盘和椅子之间”。在这种情况下是正确的。：）关键帧太多导致了我自己的麻烦。

您是否尝试过非供应商前缀的

动画迭代计数：1你好，马特！谢谢你的答复。是的，我也试过。动画一直持续到持续时间（25秒）上升，我似乎已经解决了我的问题，删除了不同的百分比，并使用了一个简单的：从{width:0px；opacity:0；}/到{width:465px；opacity:7；}所有这些数字都肯定让我的头受伤了。关键帧太多是如何导致这个问题的？要修复它，您必须删除多少个？
.capback {
background: #000;
opacity:0.7;
filter:alpha(opacity=40);
position: absolute;
height: 17px;
width: 465px;
top: 1px;
left: 1px;
color: #fff;
padding: 5 0 0 10px;
font-size: 12px;
 -moz-animation: fullexpand 25s ease-out;
 -moz-animation-iteration-count:1;
 -webkit-animation: fullexpand 25s ease-out;
 -webkit-animation-iteration-count:1;
 -o-animation: fullexpand 25s ease-out;
 -o-animation-iteration-count:1;
}

@-moz-keyframes fullexpand {

0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }

4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }

16%, 36%, 56%, 76%, 96% { width:465px; opacity:0.7; }

17%, 37%, 57%, 77%, 97% { width:465px; opacity:0.3; }

18%, 38%, 58%, 78%, 98% { width:465px; opacity:0; }

}

@-webkit-keyframes fullexpand {

0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }

4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }

16%, 36%, 56%, 76%, 96% { width:465px; opacity:0.7; }

17%, 37%, 57%, 77%, 97% { width:465px; opacity:0.3; }

18%, 38%, 58%, 78%, 98% { width:465px; opacity:0; } 

}

@-o-keyframes fullexpand {

0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }

4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }

16%, 36%, 56%, 76%, 96% { width:465px; opacity:0.7; }

17%, 37%, 57%, 77%, 97% { width:465px; opacity:0.3; }

18%, 38%, 58%, 78%, 98% { width:465px; opacity:0; } 

}