浏览器如何处理无法识别的规则？

Question

CSS at-rules（例如，@import）自CSS2起就已存在。新的规则正逐渐添加到CSS3，例如@supports，具有不同级别的浏览器支持。主要浏览器如何处理他们不承认的不受支持的规则？他们只是被忽略了吗？或者他们被视为语法错误？

例如，如果我使用任何版本的IE都不支持的@supports at-rule，IE会因语法错误而失败，还是会被忽略？

@supports (pointer-events: none) {
  ...
}

Answer 1

CSS 2.1规范说

  

4.2 Rules for handling parsing errors

     

at-rules包含未知的关键字。

     

用户代理必须ignore无效的at-keyword及其后的所有内容，直至   包含无效at-keyword的块的结尾，或者最多为和   包括下一个分号（;），或者包括下一个分号   阻止（{...}），以先到者为准。

     

例如，请考虑以下事项：

     

@three-dee {
  @background-lighting {
    azimuth: 30deg;
    elevation: 190deg;
  }
  h1 { color: red }
}
h1 { color: blue }

     

@three-dee at-rule不是CSS 2.1的一部分。因此，整体而言   at-rule（包括第三个右大括号）是   ignored。一个CSS 2.1用户代理ignores它，有效地减少了   样式表：

     

h1 { color: blue }