c# - Razor 输出@-webkit-keyframes

Question

如何在 razor 页面中输出“@-webkit-keyframes”？

我试过

@@-webkit-keyframes progressBar {
        0% {
            width: 0;
        }

        100% {
            width: 100%;
        }
    }

但是好像不行。谢谢。

Answer 1

在'Keyframes' 或'-Webkit-..' 前使用@@ 使代码无缝运行。

这是用于 Razor View 的一段虚拟代码:

    .blinkMan1 {
        animation: blinker 2s linear 0s forwards;
    }

    .blinkMan2 {
        animation: blinker 2s linear 3s forwards;
    }

    .blinkMan3 {
        animation: blinker 2s linear 6s forwards;
    }

    .blinkMan4 {
        animation: blinker 2s linear 9s forwards;
    }


    /* Chrome, Safari, Opera */
    @@-webkit-keyframes blinker {

        to {
            background-color: rgba(115, 242, 203, 0.80);
        }
    }

    /* Standard syntax */
    @@keyframes blinker {

        to {
            background-color: rgba(115, 242, 203, 0.80);
        }
    }