@document - CSS（层叠样式表）编辑

这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

@document CSS at-rule 根据文档的 URL 限制其中包含的样式规则的作用范围。它主要是为用户定义的样式表（UserStyle）而设计的，但也可以在作者定义的样式表上使用。

@document url("https://www.example.com/") {
  h1 {
    color: green;
  }
}

语法

@document 规则可以指定一个或多个匹配函数。如果任何功能适用于给定的 URL，则该规则将对该URL生效。可用的函数如下：

url()，匹配整个 URL。
url-prefix()，匹配文档的 URL 是否以参数指定的值开头。
domain()，匹配文档的域名是否为参数中指定的域名或者为它的子域名。
regexp()，匹配文档的 URL 是否和参数中指定的正则表达式匹配。该表达式必须匹配整个 URL。

提供给 url()、url-prefix()，和 domain() 函数的参数可以不使用引号括起来。但提供给 regexp() 函数的参数必须用引号括起来。

提供给 regexp() 函数的正则表达式中的转义字符必须再次进行一次 CSS 转义。例如，一个点号（.），在正则表达式中匹配任意换行符之外的字母.如果想要匹配一个正真的点号，必须首先按照正则表达式的规则转义一次（变为 \.）然后在使用CSS的规则再转义一次（转换为\\.）。

例子

@document url(http://www.w3.org/),
          url-prefix(http://www.w3.org/Style/),
          domain(mozilla.org),
          regexp("https:.*")
{
  /* 该条CSS规则会应用在下面的网页:
     + URL为"http://www.w3.org/"的页面.
     + 任何URL以"http://www.w3.org/Style/"开头的网页
     + 任何主机名为"mozilla.org"或者主机名以".mozilla.org"结尾的网页
     + 任何URL以"https:"开头的网页 */

  /* 让上述网页变得超级丑 */
  body {
    color: purple;
    background: yellow;
  }
}

规范

文档	状态	注释
CSS Conditional Rules Module Level 3 @document	Candidate Recommendation

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.