Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

@document

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

概述

@document is an at-rule that restricts the style rules contained within it based on the URL of the document. It is designed primarily for user style sheets. A @document rule can specify one or more matching functions. If any of the functions apply to a URL, the rule will take effect on that URL.

The main use case is for user-defined stylesheets, though this at-rule can be used on author-defined stylesheets too.

可用的函数有下面几个:

  • 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:"开头的网页 */

  /* make the above-mentioned pages really ugly */
  body { color: purple; background: yellow; }
}

规范

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

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 未实现 1.5 (1.8) -moz 未实现 未实现 未实现
regexp() 未实现 6.0 (6.0) 未实现 未实现 未实现
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support ? ? ? ? ? ?
regexp() 未实现 未实现 ? 未实现 未实现 未实现

相关链接

文档标签和贡献者

 此页面的贡献者: fscholz, teoli, ziyunfei
 最后编辑者: fscholz,