mozilla

Revision 33187 of @document

  • Revision slug: CSS/@document
  • Revision title: @document
  • Revision id: 33187
  • Created:
  • Creator: Np
  • Is current revision? No
  • Comment 22 words removed

Revision Content

CSSMozExtensionRef();

Summary

The @-moz-document rule is a Gecko-specific 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.

Syntax

{{ gecko_callout_heading("6.0") }}

Support for regular expressions using the regexp()function, which lets you match the document's URL to a regular expression, was added in Gecko 6.0 {{ geckoRelease("6.0") }}. Unlike the other functions, the value provided to the regexp()function must be enclosed in quotes.

Examples

You can put this into your userContent.css file:

@-moz-document url(http://www.w3.org/),
               url-prefix(http://www.w3.org/Style/),
               domain(mozilla.org),
               regexp("https:.*")
{
  /* CSS rules here apply to:
     + The page "http://www.w3.org/".
     + Any page whose URL begins with "http://www.w3.org/Style/"
     + Any page whose URL's host is "mozilla.org" or ends with
       ".mozilla.org"
     + Any page whose URL starts with "https:" */

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

Specifications

Browser compatibility

Available since Mozilla 1.8 / Firefox 1.5.

{{ languages( { "fr": "fr/CSS/@-moz-document", "ja": "ja/CSS/@-moz-document", "pl": "pl/CSS/@-moz-document" } ) }}

Revision Source

<pre class="script" style="font-size: 16px;">CSSMozExtensionRef();</pre>
<h2>Summary</h2>
<p>The <code>@-moz-document</code> rule is a Gecko-specific 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.</p>
<h2>Syntax</h2>
<div class="geckoVersionNote">
<p>{{ gecko_callout_heading("6.0") }}</p>
<p>Support for regular expressions using the <code>regexp()</code>function, which lets you match the document's URL to a <a href="/en/JavaScript/Guide/Regular_Expressions" title="en/Core JavaScript 1.5 Guide/Regular Expressions">regular expression</a>, was added in Gecko 6.0 {{ geckoRelease("6.0") }}. Unlike the other functions, the value provided to the <code style="font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace; color: inherit; font-weight: inherit; ">regexp()</code>function <strong>must</strong> be enclosed in quotes.</p>
</div>
<h2>Examples</h2>
<p>You can put this into your <code><a class="external" href="http://www.mozilla.org/support/firefox/edit#content">userContent.css</a></code> file:</p>
<pre class="brush: css">@-moz-document url(http://www.w3.org/),
               url-prefix(http://www.w3.org/Style/),
               domain(mozilla.org),
               regexp("https:.*")
{
  /* CSS rules here apply to:
     + The page "http://www.w3.org/".
     + Any page whose URL begins with "http://www.w3.org/Style/"
     + Any page whose URL's host is "mozilla.org" or ends with
       ".mozilla.org"
     + Any page whose URL starts with "https:" */

  /* make the above-mentioned pages really ugly */
  body { color: purple; background: yellow; }
}</pre>
<h2>Specifications</h2>
<ul> <li><a class="external" href="http://lists.w3.org/Archives/Public/www-style/2004Aug/0135">Per-site user style sheet rules</a>. Not part of any W3C specification.</li>
</ul>
<h2>Browser compatibility</h2>
<p>Available since Mozilla 1.8 / <a href="/en/Firefox_1.5_for_developers" title="en/Firefox_1.5_for_developers">Firefox 1.5</a>.</p>
<p>{{ languages( { "fr": "fr/CSS/@-moz-document", "ja": "ja/CSS/@-moz-document", "pl": "pl/CSS/@-moz-document" } ) }}</p>
Revert to this revision