SASS功能/ mixins用于属性值

Question

这是一个例子mixin：

=border($alpha: 0.2)
    1px solid hsla(0, 0, 0, $alpha)

我想使用函数/ mixins来实现这样的目标：

border-right: +border(0.2)

这将编译成：

border-right: 1px solid hsla(0, 0, 0, 0.2)

我还没有看到任何关于如何使用函数/ mixins动态计算属性值的文档。我只看到他们在包括房产时使用它们。怎么可以实现呢？

Answer 1

您可以编写如下函数：

@function border($alpha: 0.2)
  $border: 1px solid hsla(0, 0, 0, $alpha)
  @return $border

并像其他任何sass /指南针功能一样应用它们：

border-right: border(0.2)