CSS关键帧在Code Loader上有效，但在Fiddle或我的页面上无效

Question

我将从关键帧的新手入手，所以这可能是一个新手错误。

我想让此代码加载器代码在我的页面上运行： https://codepen.io/gbrent/pen/XPMGXP

它在我的页面或小提琴上不起作用： http://jsfiddle.net/qmL7x9j2/

HTML：

<div class="loader">
  <span>{</span><span>}</span>
</div>

CSS：

    .loader {
    color: #0079f2;

    font-family: Consolas, Menlo, Monaco, monospace;
    font-weight: bold;
    font-size: 30vh;

    opacity: 0.8;

    span {
        display: inline-block;
        animation: pulse 0.4s alternate infinite ease-in-out;

        &:nth-child(odd) {
        animation-delay: 0.4s;
        }
    }
    }

    @keyframes pulse {
        to {
            transform: scale(0.8);
            opacity: 0.5;
        }
    }

有人可以看到我在做什么错吗？我在这里想念东西吗？

Answer 1

要使用您的CodePen查看已编译的CSS，请使用glm::translate选项。

您的CSS就是：

View compiled CSS

在小提琴中工作的人。