2

我最近注意到我一直在使用all每个@media查询规则，但我不知道我为什么这样做。

我在网上搜索过，我看到网上的大多数@media规则示例都使用这样的格式，如果没有指定媒体@media all and (some other condition...)类型，为什么已经隐含了媒体类型？all可能是一些较旧的浏览器兼容性问题？

我想我真正要问的是为什么all在不需要时使用媒体类型是常见的做法？

4

1 回答 1

4

正如媒体查询 W3C 建议中所述：

'all' 用于指示样式表适用于所有媒体类型。

...

为适用于所有媒体类型的媒体查询提供了简写语法；可以省略关键字“all”（以及尾随的“and”）。即，如果媒体类型未明确给出，则为“全部”。

在我看来，在第一个引用的句子中使用这些词来表示听起来就像all它本身一样，可以纯粹用于演示目的。

但是，有一些部分all用于特定目的。在第 3.1 节中，该文件提到：

未知的媒体功能。"not all"当指定的媒体特征之一未知时，用户代理将表示媒体查询。

未知的媒体特征值。与未知媒体特征一样，用户代理将"not all"在指定媒体特征值之一未知时表示媒体查询。

格式错误的媒体查询也默认not all为 。

正如 BoltClock 在他对该问题的评论中提到的那样，另一个例子是使用only all. 该关键字only用于隐藏旧用户代理的样式表。我们可以使用以下 CSS 进行测试：

body {
    background: red;
}

@media only all {
    body {
        background: green;
    }
}

如果我们在现代浏览器中打开它，文档body将具有绿色背景。如果我们在旧版浏览器（例如 IE8）中打开它，文档的body背景将是红色。

JSFiddle 演示。

于 2013-10-29T08:51:24.300 回答