SASS:表达式还是普通的CSS斜杠？

Question

我目前正在Go - c6中实现SASS编译器，在编写表达式解析器和计算器时，我发现了Ruby编译器的一些奇怪行为。

SASS引用在这里提到了普通的CSS '/‘和SASS除法表达式：#除法和斜杠

设计的目的是使SASS与本机CSS语法兼容，如下所示：

font: 10px/8px;             // Plain CSS, no division. looks fine.
font: 10px/8px + 3px;       // Expression
font: (10px/8px);           // Expression

上面的内容似乎没问题，但是如果你写：

.foo {
  $a: 10px/8px;
  font: $a;
}

上述资料将汇编成：

.foo {
   font: 1.25; }

以下SASS中的正常表达式将始终是不带括号的表达式：

.foo {
  padding: 2px+2px;
  padding: 2px*3;
}

产出：

.foo {
  padding: 4px;
  padding: 6px; }

然而，以下SASS产生了不同的结果：

.foo {
  padding: 2px-1px;
  padding: 2px - 1px;
}

上述资料将汇编成：

.foo {
  padding: 2px-1px; // treated as ident instead of expression
  padding: 1px; }

并且除法操作符似乎是属性值的唯一例外，这使得语法不一致和不明确。(实际上在SASS规范中有那么多不明确的语法.)

以下是问题所在：

1. 如何使表达式语法一致，并避免普通CSS '/‘和除法运算符之间的隐式行为？(如果我们不考虑SASS的兼容性)
2. 那你会怎么做？

谢谢

Answer 1

这是一个已知的语法歧义。一些解决办法以前曾在SASS github页面上讨论过。但再往前走，我再没有比这更好的建议了：

我会怎么做？这对于StackOverflow并不特别合适，但让我以您给出的font: 10px/8px示例为例。您使用了一个变量，所以我假设它是您打算不止一次使用的样式值。值本身(10px/8px)似乎相当明确地适合与font一起使用，因此我将采取稍微不同的方法，并使用%silent-class。

%font {
    font: 10px/8px;
}

.foo {
    @extend %font;
    // more styling here
}
.bar {
    @extend %font;
    // etc
}

这将正确编译，sans除法：

.foo {
    font: 10px/8px;
}
.bar {
    font: 10px/8px;
}

至于padding的例子，我认为这只是不一致而已。希望他们能在不久的将来纠正这一点。如果它还没有完成，如果你对它有强烈的感觉，看看他们怎么说，这对你来说并不是个坏主意。