Css 为什么不是'；t-moz动画工作正常吗？

以下CSS在Webkit中运行良好。还没有在Opera中检查过，但我知道它在Firefox中不起作用。有人能告诉我为什么吗

我的HTML肯定应用了正确的类（用Firebug检查了它，我确实看到了

-moz动画：500ms ease 0s normal forwards 1 arrow rotatedot

属性，位于

.arrow

）

这在IE9中也不起作用，尽管我最初有

-ms动画：…

和

-ms变换：…

。我以为它应该在IE9中工作，但当它没有工作时，我只是假设IE还不支持这些。然而，现在它在Firefox中不起作用了，也许还有别的事情在发生

.page.updatesPodcasts > .mainContent > .content .contentUpdates .disc.dot .dvd .arrow {
  -webkit-animation: arrowRotateDot 500ms forwards;
  -moz-animation: arrowRotateDot 500ms forwards;
  -o-animation: arrowRotateDot 500ms forwards;
  animation: arrowRotateDot 500ms forwards;
}
.page.updatesPodcasts > .mainContent > .content .contentUpdates .disc.f2 .dvd .arrow {
  -webkit-animation: arrowRotateF2 500ms forwards;
  -moz-animation: arrowRotateF2 500ms forwards;
  -o-animation: arrowRotateF2 500ms forwards;
  animation: arrowRotateF2 500ms forwards;
}

@-webkit-keyframes arrowRotateDot {
  100%  {
      left:-18px; top:182px;
      -moz-transform: scale(1) rotate(-30deg);
      -webkit-transform: scale(1) rotate(-30deg);
      -o-transform: scale(1) rotate(-30deg);
      transform: scale(1) rotate(-30deg);
      }
}
@-webkit-keyframes arrowRotateF2 {
  0%  {
      left:-18px; top:182px;
      -moz-transform: scale(1) rotate(-30deg);
      -webkit-transform: scale(1) rotate(-30deg);
      -o-transform: scale(1) rotate(-30deg);
      transform: scale(1) rotate(-30deg);
      }
  100%  {
      left:115px; top:257px;
      -moz-transform: scale(1) rotate(-90deg);
      -webkit-transform: scale(1) rotate(-90deg);
      -o-transform: scale(1) rotate(-90deg);
      transform: scale(1) rotate(-90deg);
      }
}

---

您的动画在Firefox中不起作用，因为您使用的是@-webkit-关键帧，这只适用于webkit浏览器，即Chrome和Safari。（某种程度上）跨浏览器制作动画关键帧的方法是：

@keyframes animationName {
    /* animation rules */
}

@-moz-keyframes animationName {
    /* -moz-animation rules */
}

@-webkit-keyframes animationName {
    /* -webkit-animation rules */
}

---

Opera和Internet Explorer当前不支持@keyframes规则。

天际线正确。Firefox不支持这一点，因此如果没有webkit，您需要额外的代码才能获得相同或类似的效果

此外，这里还有一些额外的信息，可以帮助您使用代码，或者帮助您决定在不添加额外代码的情况下从现在开始使用代码的方向（我最终改变了编写代码的方式，以避免被代码淹没）：

---

Internet Explorer 10支持关键帧规则。（不使用

-ms-

前缀）