在 JSfiddle 中，它为什么不喜欢我的 css 中的@keyframes？

Question

@keyframes example {
  0% {opacity: 0;}
  50% {opacity: 100;}
  100% {opacity: 0;}

如您所见，JS fiddle 不喜欢@keyframes 并不断返回错误。我不知道为什么，正在努力弄清楚。

有什么想法吗？

Answer 1

首先，您没有关闭您的关键帧，而是让它保持打开状态：

keyframes example {
  0% {opacity: 0;}
  50% {opacity: 100;}
  100% {opacity: 0;}

其次，你没有加@。固定版本：

@keyframes example {
  0% { opacity: 0;} 
  50% { opacity: 100; }
  100% { opacity: 0; }
}

您也从未指定要在何处使用关键帧。

Answer 2

jsfiddle代码中没有@。此外，没有右花括号 (}).

应该是这样的：

@keyframes example {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 100;
  }

  100% {
    opacity: 0;
  }
}

In JSfiddle how come it doesn't like @keyframes in my css?