如何停止 sass/compass 在媒体查询中将 "not print" 评估为 "false"

Question

如您所见，sass/compass 解析 not print 并将其变为 false - 破坏了媒体查询。

$ cat test.scss
@media (not print) and (min-width: 600px) {
  color: #000;
}
$ sass test.scss
@media (false) and (min-width: 600px) {
  color: #000;
}

我试过用unquote但是它也不配合

Answer 1

你不能。

Sass原因

当Sass遇到括号时，它会尝试计算内容。 not 关键字用于否定，因此当它看到 not print 时，计算结果为 false.

因此，您尝试使用字符串 'not'。如果它位于 other 除了媒体查询之外的任何地方，它都可以工作。

.foo { color: (#{'not'} #000); }

评估为

.foo {
  color: not #000;
}

媒体查询 在 Sass 中被特殊处理，并且必须遵守媒体查询的一般格式。

CSS原因

即使您可以生成所需的CSS，它也是无效的。如果您阅读了用作参考的 MDN 页面，它指定了以下内容：

The not keyword cannot be used to negate an individual feature query, only an entire media query

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

所以不，无法指定您的样式将由最小视口宽度为 600 像素的设备使用并且不会打印。

如何停止 sass/compass 在媒体查询中将 "not print" 评估为 "false"

How to stop sass/compass evaluating "not print" in media query as "false"

sass

Sass原因

CSS原因