CSS功能查询

如何在CSS中使用功能查询

功能查询是CSS的一种近期且相对未知的功能，但是良好的支持一。

我们可以使用它来检查浏览器是否支持某功能@supports关键词。

我认为这是一个示例，在撰写本文时，这对于检查浏览器是否支持CSS网格特别有用，可以使用以下方法完成此操作：

@supports (display: grid) {
  /* apply this CSS */
}

我们检查浏览器是否支持grid的价值display财产。

我们可以用@supports对于任何CSS属性，请检查任何值。

我们也可以使用逻辑运算符and，or和not建立复杂的功能查询。

本示例检查浏览器是否同时支持CSS网格和弹性盒：

@supports (display: grid) and (display: flex) {
  /* apply this CSS */
}

免费下载我的CSS手册