@support规则允许用户对CSS属性进行功能查询。我想知道是否可以对@media规则进行功能检查？
例如，我想知道浏览器是否支持@media指针或任何指针条件：
@supports @media (pointer:fine) {
或者
@supports @media (pointer) {
这似乎不起作用。应该有用吗？
修改：这与引用的问题不重复。也许我应该澄清这个问题来解释为什么这是一个不同的问题，所以这里是：
我不想在@media中嵌套@supports，反之亦然。我想要检测是否支持@media查询本身，特别是指针的@media规则。这与在媒体查询中嵌套随机支持查询完全不同。
答案 0 :(得分：10)
这似乎不起作用。它应该有用吗？
没有; @supports仅支持属性声明，而不支持CSS中的at-rules或任何其他语法结构。您无论如何都不打算检查对@media规则的支持;您正在尝试检查对特定媒体功能的支持。但@supports也不支持，即使媒体功能与属性声明共享相同的声明语法。
为此，您根本不需要@supports规则。要检查浏览器是否支持某种媒体功能，只需编写一个@media规则，其中包含媒体查询列表，其中包含媒体功能及其否定：
@media not all and (pointer), (pointer) {
p { color: green; }
}<p>If this text is green, your browser supports the <code>pointer</code> media feature.
（请注意，媒体查询4从MQ3中删除了需要媒体类型的not的限制，因此否定应该是not (pointer)，但是no browser supports this yet并且媒体类型仍然是必需的。）
无法识别pointer媒体功能的浏览器会将@media规则解释为@media not all, not all（尽管not中not all and (pointer)媒体查询）。请参阅section 3.2 of the spec，其中包含
未知＆lt; mf-name＆gt;或者＆lt; mf-value＆gt;，或者不允许＆lt; mf-value＆gt;，导致值“未知”。 ＆lt;媒体查询＆gt;其值为“未知”必须替换为全部。
如果您需要在浏览器 支持媒体功能时应用CSS，则这些错误处理规则意味着您需要利用级联（如果您不喜欢＆＃ 39;事先知道原始值，你可能会卡住）：
p { color: red; }
@media not all and (pointer), (pointer) {
p { color: currentcolor; }
}<p>If this text is red, your browser does not support the <code>pointer</code> media feature.