Html Zurb基金会Gualal.SCSS元样式为JS？ 我正在研究一个基金会5项目，结果是一个过时的全局G.SSS组件。我试图开始工作，但他们却神秘地没有。事实证明，我缺少以下两行CSS： meta.foundation-data-attribute-namespace { font-family: false; }

谁能给我解释一下这些台词吗？文件说：

// Used to provide media query values for javascript components.
// Forward slash placed around everything to convince PhantomJS to read the value.

meta.foundation-mq-small {
  font-family: "/" + unquote($small-up) + "/";
  width: lower-bound($small-range);
}

meta.foundation-mq-medium {
  font-family: "/" + unquote($medium-up) + "/";
  width: lower-bound($medium-range);
}

meta.foundation-mq-large {
  font-family: "/" + unquote($large-up) + "/";
  width: lower-bound($large-range);
}

meta.foundation-mq-xlarge {
  font-family: "/" + unquote($xlarge-up) + "/";
  width: lower-bound($xlarge-range);
}

meta.foundation-mq-xxlarge {
  font-family: "/" + unquote($xxlarge-up) + "/";
  width: lower-bound($xxlarge-range);
}

meta.foundation-data-attribute-namespace {
  font-family: #{$namespace};
}

---

谢谢。

一些基金会的JavaScript需要了解不同的媒体查询范围定义

对于某些组件来说尤其如此，例如交换，它实际上是指根据视口的不同行为

但基础也有不同的断点。

为了使值设置在一个地方，基金会使用添加匹配的类名的元的媒体查询断点定义的小技巧。 下面是它的工作原理，对于断点

$small up

（其他断点也是如此）：

假设您保留默认值：

$small up:only screen

基础上的JS将执行以下操作：

使用类

.foundation mq small

读取CSS属性的值

字体系列

现在它知道了

$small up

媒体查询的定义

现在可以访问可能需要它的不同基础JS组件 你可以看到它是如何在

---

之所以使用

font-family

，是因为它是一种罕见的CSS属性，没有定义一组值。如果他们使用了属性

text align

，浏览器将忽略无效值，JS将得到类似

left

的回报。

太棒了，谢谢。关于字体系列作为占位符的最后一点，因为它不能有无效的值，这是我理解中缺少的关键。据我所知，

内容

也允许任何值，但只适用于

：before

和

：after

，这在JS中是无法访问的