sass - 如何向 Zurb Foundation 4 REM 功能添加 PX 回退？

Question

我正在使用 Zurb Foundation 4 框架中的这个 SCSS 函数：

@function remCalc($pxWidth) {
  @return $pxWidth / $em-base * 1rem;
}

它只返回一个 REM 值，因此它不适用于 IE8。是否可以添加 PX 后备以支持 IE8？我对 SASS 函数的编码不熟悉。

Answer 1

@mixin font-size($pxWidth){
  font-size:$pxWidth;
  font-size:remCalc($pxWidth);
}
.yourclass {
  @include font-size(16px); //outputs font-size:16px; font-size:1rem;
}

Answer 2

如 Foundation 4 Docs 中所述，不支持 ie8，请参阅他们的扩展文章，完整解释为什么他们不再支持它。

如果您正在寻找 IE8 支持，他们建议您恢复到 Foundation 3.2

http://foundation.zurb.com/docs/faq.html

Answer 3

最好的解决方案是使用 polyfill 在 IE8 和更早版本中启用 rem 支持。

不幸的是，我不确定是哪一个。尝试html5shim和IE9.js作为初学者。

有问题的函数是一个函数，而不是一个 mixin。所以它不能提供后备。考虑为此目的编写自己的 mixin。您可以使用一些技巧来使一行 CSS 仅适用于 IE。