diff options
Diffstat (limited to 'files/es/web/css/@document/index.html')
-rw-r--r-- | files/es/web/css/@document/index.html | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/files/es/web/css/@document/index.html b/files/es/web/css/@document/index.html new file mode 100644 index 0000000000..250b5342c7 --- /dev/null +++ b/files/es/web/css/@document/index.html @@ -0,0 +1,82 @@ +--- +title: '@document' +slug: Web/CSS/@document +translation_of: Web/CSS/@document +--- +<div>{{CSSRef}}{{SeeCompatTable}}</div> + +<p>The <strong><code>@document</code></strong> <a href="/en-US/docs/Web/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/At-rule">at-rule</a> restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style sheets, though it can be used on author-defined style sheets, too.</p> + +<pre class="brush: css no-line-numbers">@document url("https://www.example.com/") { + h1 { + color: green; + } +} +</pre> + +<ul> +</ul> + +<h2 id="Syntax">Syntax</h2> + + + +<p>Una regla @document puede especificar una o más funciones coincidentes. Si alguna de las funciones se aplica a una URL determinada, la regla tendrá efecto en esa URL. Las funciones disponibles son:</p> + +<ul> + <li><code>url()</code>, which matches an exact URL.</li> + <li><code>url-prefix()</code>, which matches if the document URL starts with the value provided.</li> + <li><code>domain()</code>, which matches if the document URL is on the domain provided (or a subdomain of it).</li> + <li><code>regexp()</code>, which matches if the document URL is matched by the <a href="/en-US/docs/Web/JavaScript/Guide/Regular_Expressions">regular expression</a> provided. The expression must match the entire URL.</li> +</ul> + +<p>The values provided to the <code>url()</code>, <code>url-prefix()</code>, and <code>domain()</code> functions can be optionally enclosed by single or double quotes. The values provided to the <code>regexp()</code> function <em>must</em> be enclosed in quotes.</p> + +<p>Escaped values provided to the <code>regexp()</code> function must additionally be escaped from the CSS. For example, a <code>.</code> (period) matches any character in regular expressions. To match a literal period, you would first need to escape it using regular expression rules (to <code>\.</code>), then escape that string using CSS rules (to <code>\\.</code>).</p> + +<div class="note"> +<p><strong>Note</strong>: There is a -moz-prefixed version of this property — <code>@-moz-document</code>. This has been limited to use only in user and UA sheets in Firefox 59 in Nightly and Beta — an experiment designed to mitigate potential CSS injection attacks ({{bug(1035091)}}).</p> +</div> + +<h3 id="Formal_syntax">Formal syntax</h3> + +<pre class="syntaxbox">{{csssyntax}}</pre> + +<h2 id="Example">Example</h2> + +<h3 id="CSS">CSS</h3> + +<pre class="brush: css">@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 id="Specifications">Specifications</h2> + +<p><a href="http://www.w3.org/TR/2012/WD-css3-conditional-20120911/#at-document">Initially</a> in {{SpecName('CSS3 Conditional')}}, <code>@document</code> has been <a href="http://www.w3.org/TR/2012/WD-css3-conditional-20121213/#changes">postponed</a> to Level 4.</p> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("css.at-rules.document")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a class="external" href="http://lists.w3.org/Archives/Public/www-style/2004Aug/0135">Per-site user style sheet rules</a> on the www-style mailing list.</li> +</ul> |