css - 如何让 SASS 忽略数学运算？

Question

我有这条 SASS 线：

{ grid-area: 3 / 10 / 4 / 11; }

我正在尝试根据网格列的数量来更改网格区域：

{ grid-area: 3 / 10 / 4 / $grid-columns + 1; }

但是当我这样做时，SASS 将/字符解释为一个除法，从而生成以下结果：

{ grid-area: 0.64932 }

有没有办法让 SASS 忽略/字符而只进行$grid-columns + 1操作，所以这将是最终代码：

$grid-columns = 10
{ grid-area: 3 / 10 / 4 / $grid-columns + 1; }
{ grid-area: 3 / 10 / 4 / 11; }

标签： csssass

Answer 1

您必须将其声明为数字

{ grid-area: 3 / 10 / 4 / #{$grid-columns + 1}; }