如何编写只在非IE、非Edge浏览器中有效的CSS？答案

【问题标题】：How to write CSS that is only effective in non-IE, non-Edge browsers?如何编写只在非IE、非Edge浏览器中有效的CSS？
【发布时间】：2019-09-17 22:27:37
【问题描述】：

我正在尝试编写仅适用于“桌面”屏幕尺寸的 CSS，但前提是该页面是从非 IE 和非 Edge 浏览器查看的。我已经拥有的：

@media only screen and (min-width: 981px) /* and XXX */

上面的“XXX”是我希望获得帮助的部分。通过浏览我已经了解到这是确认 IE 存在的子句：@media all and (-ms-high-contrast: active), (-ms-high-contrast: none)，这是符合 Edge 的子句：@supports (-ms-ime-align: auto)。但是，我无法使用正确的 CSS 来“连接”和“否定”这两者。

【问题讨论】：

Edge 正在使用 -webkit，因此很难否定，我建议根据浏览器检测浏览器并提供样式表。

标签： css internet-explorer microsoft-edge

【解决方案1】：

您可以使用not operator 创建表达式，如下所示：

@supports not (-ms-ime-align:auto) {
    /*Non-Edge and Non-IE  style*/
    body {
        background-color: azure;
    }
}

【讨论】：

非常感谢。您所附的参考资料很有帮助。但是，我仍在试图弄清楚如何将这两个子句“与”在一起，即。 @media 和 @support。我也尝试过嵌入，即。 @support not (-ms-ime-align:auto) { @media only screen and (min-width: 981px) {} }
你可以同时使用@media和@support，效果也很好，请参考this sample。