有什么方法可以在 property/rule 名称中使用变量？

Question

有没有办法在 属性 或规则名称中使用变量，即：

.foo {
   @dir: right;
   border-{@dir}: 2px;
}

Answer 1

你用 Sass 标记了你的 post，所以下面是你如何使用 SCSS 语法来完成它：

.foo {
   $dir: right;
   border-#{$dir}: 2px;
}

我确认这是在 SassMeister 上工作。

Answer 2

哦，实际上我的代码稍微修改一下就可以工作，将 @ 放在 } 之前。

@dir: right;
.foo-@{dir} {
  border-@{dir}: 2px;
}