Mixin：动态添加属性

Question

使用 Mixin，我想确定两个条目之间的值并将其添加到特定属性。 这是一个虚拟示例：

@mixin min($property, $min1, $min2) {
  @if ($min1 > $min2) {
    $property: $min2;
  }
  @else {
    $property: $min1;
  }
}

.test {
  @include min(width, 11px, 13px);
}

.test1 {
  @include min(background-size, 30px, 13px);
}

.test2 {
  @include min(height, 8px, 50px);
}

我想要输出：

宽度：11px；

背景尺寸：13px；

高度：8px；

问题是$property: $min1; 将min1 值设置为property，我想返回一个文字。

我怎样才能使用 mixin 做到这一点？

Answer 1

你快到了。您必须在 $property 变量上使用 interpolation：

@mixin min($property, $min1, $min2) {
  @if ($min1 > $min2) {
    #{$property}: $min2;
  }
  @else {
    #{$property}: $min1;
  }
}