Question

Sass新手在这里。和mixin一起玩。有些事情是对的：

$> sass -v
Sass 3.4.23 (Selective Steve)

$> cat myscss.scss

// Keyframe animations
@mixin keyframes($animation-name) {
  @-webkit-keyframes $animation-name {
    @content;
  }
}

@include keyframes(move-up) {
  0% {
    top: 25px;
    opacity: 1;
  }

  100% {
    top: -50px;
    opacity: 0;
  }
}


$> sass myscss.scss
@-webkit-keyframes $animation-name {
  0% {
    top: 25px;
    opacity: 1; }
  100% {
    top: -50px;
    opacity: 0; } }

这就是问题所在。我在期待：

@-webkit-keyframes move-up {
  0% {
    top: 25px;
    opacity: 1; }
  100% {
    top: -50px;
    opacity: 0; } }

我错过了什么？

请在这里加上我的添加或无意义的文字。显然stackoverflow不会让我发布我的问题，因为他们看到太多的代码和太少的文字。希望这已经足够了。

Answer 1

在谷歌上搜索，我看到这就是诀窍，但为什么会这样，我不清楚：

@mixin keyframes ($animation-name) {
  @-webkit-keyframes #{$animation-name} {
    @content;
  }
}

困扰了Sass中的mixins和$变量

1 个答案: