一切都在标题中。我不能在CSS calc()函数中合并几个Stylus变量。

我创建了一个代码Sass,我将在手写笔下转换自己:

// *.scss

$gutter : 1rem;

.sizeXS-m10 {
    width: calc(#{100% / 12 * 10} - #{$gutter});
}

对于单个变量,没问题:
// *.styl

$gutter = 1rem

.sizeXS-m10
  width 'calc(100% / 12 * 10 - %s)' % $gutter

尝试将此操作的结果集成到变量中时,事情变得很复杂:
100% / 12 * 10

最佳答案

只需将值包装在方括号中,如下所示:

// *.styl

$gutter = 1rem

.sizeXS-m10
  width 'calc(%s / %s * %s - %s)' % (100% 12 10 $gutter)

10-06 11:51