sass - 在 Sass 函数中添加两个值创建 'px' 的双实例

Question

我在 Sass 中有一个自定义函数，它接受一个 em 值，去除单位并创建一个 px 值:

@function stripAndPx($in){
  $stripped: $in / ($in * 0 + 1); //strip unit
  @return #{ (($stripped) * 16) + 'px'}; //convert to px
}

然后我尝试获取一个 em 变量:

$em-variable: 1em;

并将其添加到基于像素的变量中:

$px-variable: 20px;

例子:

right: $px-variable + (stripAndPx($em-variable));

创建此输出:

right: 20px16px;

我希望添加两个值:

右:36px;

Answer 1

您的函数返回一个字符串，而不是一个数字。 Sass 假定您想要连接它们，因为这是它可以对字符串和任何其他类型执行的所有操作。

@function stripAndPx($in){
  $stripped: $in / ($in * 0 + 1); //strip unit
  @return (($stripped) * 16) * 1px; //convert to px
}