在 Sass 中为数字添加单位

Posted 2023-03-06

【中文标题】在 Sass 中为数字添加单位

【英文标题】：Adding a unit to a number in Sass

【发布时间】：2013-03-08 22:45:22

【问题描述】：

我正在尝试创建动态值，但到目前为止都失败了。创建的像素值似乎失去了用于计算的能力。

$numericValue: 30;

$pixelValue: $numericValue+px;
// also tried $pixelValue: #$numericValuepx;

$calc: $pixelValue * 2;
// also tried $calc: unquote($pixelValue) * 2;

这会引发错误

语法错误：未定义操作：“30px 乘以 2”

【参考方案1】：

当你想添加一个单元时，诀窍是使用* 1px。使用 +px 或插值 (#$numericValuepx) 将其转换为字符串。

$numericValue: 30;

$pixelValue: $numericValue * 1px;

$calc: $pixelValue * 2;

【参考方案2】：

您需要定义您将使用的单位。如果您正在使用像素，您可以创建将px 添加到$numericValue 的动态值。

$numericValue: 30px;
$pixelValue: $numericValue;
$calc: $pixelValue * 2;