是否有一个简短的方法来列出带有供应商前缀的CSS3关键帧?

ins*_*ere 6 css3 css-animations

目前我必须列出所有变化:

@-webkit-keyframes show {
    from { background-color: rgba(0, 0, 0, 0); }
    to { background-color: rgba(0, 0, 0, 0.8); }
}

@-moz-keyframes show {
    from { background-color: rgba(0, 0, 0, 0); }
    to { background-color: rgba(0, 0, 0, 0.8); }
}

[…]
Run Code Online (Sandbox Code Playgroud)

你明白了.有没有办法写这个更短?像这样的东西没有破坏它:

@-webkit-keyframes show, @-moz-keyframes show {}
Run Code Online (Sandbox Code Playgroud)

and*_*dyb 6

在CSS中本身不是,但你可以通过使用CSS预处理器来实现这一点,例如LESS支持"mixins"的概念来删除一些重复.

可在此处找到更多信息,特别是文章中的示例:

@-webkit-keyframes some-animation {.mixi-frames;}
@-moz-keyframes some-animation {.mixi-frames;}

.mixi-frames () {
    from {width: 254px;}
    to {width: 512px;}
}
Run Code Online (Sandbox Code Playgroud)