CSS：对不起，at规则@keyframes没有实现

尝试使用在中找到的示例作为参考制作简单动画

然而，我试图制作动画的图像静止不动。Aptana editor抛出这些错误-“属性动画不存在”，“属性动画迭代计数不存在”，“抱歉，at规则@keyframes未实现”

我的html：

<div id="animate"><img src="flower.jpg"> </div>

第三个错误，“对不起，at规则@keyframes未实现”-这是否意味着此功能未在全球范围内正式实现？如果是，为什么W3schools的示例代码工作正常，但我的编辑器中的代码不工作

---

在windows上使用Mozilla 18.0.2对我来说似乎很管用。我添加了一个包含类以确保安全

---

另外，您只编写了moz关键帧。您正在Firefox中测试，对吗？

Wc3 validator认为@-webkit关键帧没有实现，因为它是特定于供应商的。所以这不是您的问题，也不是编辑器的问题，这是Wc3验证标准。

Aptana很奇怪。您应该直接在浏览器中进行测试。Aptana拥有它我们自己对HTML/CSS的预期定义。这些通常是我们的日期，因为标准的发展速度比应用程序的更新速度快。忽略编辑器，使用真正的浏览器。好的。但我仍然无法为图像设置动画。上面的代码有什么问题吗？太好了，我添加了

position:relative

to#animate img后，它就开始工作了选择器！没有考虑<代码>位置：相对< /代码>在元素移动中是重要的），这允许您的绝对定位生效。

#animate img 
{
    width:50px;
    height:50px;
    animation: test 25s;
    animation-iteration-count: 10;
    -moz-animation: test 25s;
}

@keyframes test
{
0%   {left:0px; top:0px;}
25%  {left:200px; top:0px;}
50%  {left:200px; top:200px;}
75%  {left:0px; top:200px;}
100% {left:0px; top:0px;}
}

@-moz-keyframes test
{
0%   {left:0px; top:0px;}
25%  {left:200px; top:0px;}
50%  {left:200px; top:200px;}
75%  {left:0px; top:200px;}
100% {left:0px; top:0px;}
}