@document CSS At-Rule

Description

The @document CSS at-rule sets rules based on the address of the document. For example, if the addresses of the mobile and the main version of the site are different, then we can set our own style of elements for each version.

Syntax

@document [ <url> | url-prefix(<string>) | domain(<string>) | media-document(<string>) | regexp(<string>) ]# {
  <group-rule-body>
}

Values

• url()Specifies the exact address of the page for which style rules apply. The address is written inside the url () brackets.
• url-prefix()The value at which the address of the document begins.
• domain()The domain or subdomain of the site.
• regexp()The regular expression to which the address matches.

Example

@document url("http://www.example.com/widgets/") {

  body {

    color: #FFF;

    background: #800;

  }

}

Browser Support

Desktop
X	X	X	?	X	X
Tablets / Mobile
X	X	?	X	X	X