如何检测[如果！ webkit]通过媒体查询

Question

当我在我的.less文件中写[if ! webkit]时它会给我一个错误，因为它无法将其转换为css代码。

我的代码中还有[if webkit]所以我写了

@media all and (-webkit-min-device-pixel-ratio:1) {
    html, body {
        background-color: black;
    }
}

而不是

html, body {
    [if webkit]background-color:black;
}

它工作正常，所以我需要[if ! webkit]

的类似解决方案

有人可以帮我吗？

Answer 1

您的示例中的媒体查询是特定于供应商的媒体查询。它只会被webkit浏览器识别，因为它们是唯一使用此前缀的人。当firefox看到这段代码时，它无法识别它，因此会被忽略。没有“not webkit”代码，因为其他浏览器不使用这些前缀。其他供应商可能会提供自己的版本 （即min - moz-device-pixel-ratio）

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries#-moz-device-pixel-ratio

但如果他们没有自己，你就是SOL。我始终建议使用
http://rafael.adm.br/css_browser_selector/

作为浏览器特定问题的快速修复。