在Sass中向数字添加单位

ass CSS

乐米亚

2020-03-24

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

$numericValue: 30;

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

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

这引发一个错误

语法错误:未定义的操作:“ 30px×2”

第3348篇《在Sass中向数字添加单位》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

2个回答
番长前端猴子 2020.03.24

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

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

诀窍是* 1px在要添加单位时使用。使用+px或插值(#{$numericValue}px)会将其转换为字符串。

$numericValue: 30;

$pixelValue: $numericValue * 1px;

$calc: $pixelValue * 2;

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android