Sass 中两个变量的比率

Question

我正在尝试根据两个变量的比率缩放一个值：

$w: 500px;
$a: 1px;
$b: 2px;
$result: calc(#{$w} * #{$a}/#{$b});

我试着做 calc(#{$w} * math.div(#{$a},#{$b}));。令我惊讶的是，我找不到关于该主题的任何以前的 post。

那么，我该如何实现呢？

Answer 1

您不能调用 calc 来分配 sass 个变量。它是一个 css 函数，在运行时计算，sass 在编译时处理。

以下是您的选择：

@use "sass:math";

$w: 500px;
$a: 1;
$b: 2;
$ratio: math.div($a, $b);
$result: $w * $ratio;

或旧 sass 版本

$w: 500px;
$a: 1;
$b: 2;
$result: $w * ($a / $b);

Ratio of two variables in Sass