SASS 使用 SASS rgba() 函数的 mixin 不适用于插值

Question

SASS 文档说 rgba 函数可以通过两种方式调用。

我创建了一个 codepen 来演示 mixin 中的 rgba 函数我遇到了问题：

$hd-color1: #366dbd;    // heading color
$hd-shadow1: 0.24;      // text shadow opacity

@mixin ColorAndTextShadow($color, $opacity) {
  color: $color;
  text-shadow: 3px 1px rgba( #{$color}, #{$opacity} );
}

h2 {
  @include ColorAndTextShadow ( #{$hd-color1}, #{$hd-shadow1} );
  font-family: Circular, Helvetica, Arial, sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-transform: uppercase;
}

提前感谢您的浏览

Answer 1

我认为这只是一个语法错误。可以直接传入变量。

请参阅codepen

$hd-color1: #366dbd;    // heading color
$hd-shadow1: 0.24;      // text shadow opacity

@mixin ColorAndTextShadow($color, $opacity) {
  color: $color;
  text-shadow: 3px 1px rgba($color, $opacity );
}

h2 {
  @include ColorAndTextShadow ( $hd-color1, $hd-shadow1 );
  font-family: Circular, Helvetica, Arial, sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-transform: uppercase;
}

SASS 使用 SASS rgba() 函数的 mixin 不适用于插值

SASS mixin using SASS rgba() function not working with interpolation

sass

rgba