我目前正在将 SASS 与 Visual Studio(与 Mindscape)一起使用,我想创建一个简单的 mixin,而不必编写 -ms-、-o-、-webkit- 等...
我有这个最终的 CSS:
@-webkit-keyframes animate-loading-bar {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
@-moz-keyframes animate-loading-bar {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
@-ms-keyframes animate-loading-bar {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
@keyframes animate-loading-bar {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
所以我尝试创建mixin:
@mixin keyframe($name){
@-webkit-keyframes #{$name} {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
@-ms-keyframes #{$name} {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
@-moz-keyframes #{$name} {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
@keyframes #{$name} {
0% { background-position: 0 0; }
100% { background-position: 50px 50px; }
}
}
但是 Mindscape 不喜欢我的 mixin 中的“@”:(
我怎样才能做到这一点?
感谢