Question

看看下面的例子：

@mixin placeholder ($color) {
  &.-moz-placeholder {
    color: $color;
  }

  &:-ms-placeholder {
    color: $color;
  }
}

@include placeholder(#999);

但我想插入多个属性而不仅仅是占位符样式中的颜色。像这样：

@mixin placeholder ($properties) {
  &.-moz-placeholder {
    $properties;
  }

  &:-ms-placeholder {
    $properties;
  }
}

@include placeholder(color: #999, text-shadow: 1px 0px 0px #000);

这是可能的，如果是这样的话？

Answer 1

正如@dave建议的那样，你可以使用Sass的@content指令来完成这个任务。以下是使用该语法的示例：

@mixin placeholder {
  &.-moz-placeholder {
    @content;
  }

  &:-ms-placeholder {
    @content;
  }
}

@include placeholder {
  color: #999;
  text-shadow: 1px 0px 0px #000;
};

请注意，要传递内容块，请使用花括号而不是括号。您可以在SASS documentation中阅读更多内容。

Answer 2

您是否在寻找“将内容块传递给Mixin”？

http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#mixin-content

SCSS在mixin中的多个属性

2 个答案: