css - 媒体查询有什么问题？

Question

W3C standards doc说:

User agents are to represent a media query as "not all" when one of the specified media features is not known.

然后给出如下例子:

<link rel="stylesheet" media="screen and (max-weight: 3kg) and (color), (color)" href="example.css" />

然后它说第一个媒体查询将被表示为“并非全部”并评估为 false，第二个媒体查询被评估为好像第一个没有被有效地指定。

为什么会这样。我希望那是因为 max-weight 的 3kg 值不是有效值，这在文档中没有解释为原因。但是我看不到任何未知的媒体功能，但“未知媒体功能值”，这在“未知媒体功能”之后的文档中单独讨论。我认为这个例子应该放在“Unknown media feature value”下面，而不是放在“Unknown media features”中。

Answer 1

该示例所指的未知媒体功能是max-weight。一旦遇到这种情况，3kg 值就不再相关，因为它永远不会适用，因为浏览器不知道如何处理 max-weight第一名。所以它完全跳过了那个媒体查询，让你有效地做到这一点:

<link rel="stylesheet" media="not all, (color)" href="example.css" />

与此相同:

<link rel="stylesheet" media="(color)" href="example.css" />

another section 中描述了媒体功能.第一句话说:

Syntactically, media features resemble CSS properties: they have names and accept certain values.

因此只有先描述媒体功能本身的错误处理，然后再处理它们的值才有意义。