在 Sass 中为数字添加一个单位

问题描述

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

I am trying to create dynamic values, but have failed so far. The created pixel value seems to lose the ability to be used in calculations.

$numericValue: 30;

$pixelValue: $numericValue+px;
// also tried $pixelValue: #{$numericValue}px;

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

这会引发错误

语法错误:未定义操作:30px 乘以 2"

Syntax error: Undefined operation: "30px times 2"

推荐答案

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

The trick is to use * 1px when you want to add a unit. Using +px or interpolation (#{$numericValue}px) turns it into a string.

$numericValue: 30;

$pixelValue: $numericValue * 1px;

$calc: $pixelValue * 2;

这篇关于在 Sass 中为数字添加一个单位的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！