Question

编辑：第一个被解决的线程有我的问题的答案！我从mixin返回String而不是Number，因此Sass无法处理该值！

我正在使用Sass 3.2.12 (Media Mark)作为我的项目（我在Intellij IDEA 12.1计算机上运行Windows 7 Professional）我遇到了一些麻烦 rem 单位......

如果我想做这样的事情：

$my-font-size: 2.1875rem;

a {
  font-size: $my-font-size * 1.2;
}

我收到以下错误：

error design/main.scss (Line 81 of design/_components.scss: Undefined operation: "1.2 times 2.1875rem".)

此外，如果我尝试添加两个 rem 单位，例如：

$common-margin: 1.234rem;
.another-class {
  position: absolute;
  top: $common-margin + 0.3rem;
}

preprocesser没有给我一个错误，但产生的输出如下：

.another-class {
  position: absolute;
  top: 1234rem0.3rem; //<-- what's this!?
}

我在这里错过了什么吗？

Answer 1

您需要定义和使用mixin，例如per this article（another good one，哦，and one more）

  @mixin x-rem ($property, $value) {
      #{$property}: $value * $main-font-size;
      #{$property}: #{$value}rem;
  }

可以被称为，例如：

@include x-rem(font-size, 1.4);
@include x-rem(padding-left, 2);

通过为您的网站创建适当的mixin，您可以直接使用mixin中的任何基本度量（如上面的rem）功能，从而获得使用$main-font-size所需的响应能力。不要忘记 - 一个rem单位是一个相对单位，所以你不能简单地直接指定它（就像你使用$my-font-size: 2.1875rem;）。

SASS不能与“rem”一起使用 - 添加两个“rem”值时会产生错误

1 个答案: