Skip to content

Commit 307de54

Browse files
committed
[css-syntax] More clarification.
1 parent 174e3e8 commit 307de54

2 files changed

Lines changed: 36 additions & 78 deletions

File tree

css-syntax/Overview.html

Lines changed: 18 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -4484,45 +4484,25 @@ <h3 class="heading settled heading" data-level=8.1 id=style-rules><span class=se
44844484
but qualified rules inside <span class=css data-link-type=maybe title=@keyframes>@keyframes</span> rules are not <a data-biblio-type=informative data-link-type=biblio href=#css3-animations title=css3-animations>[CSS3-ANIMATIONS]</a>.
44854485

44864486
<h3 class="heading settled heading" data-level=8.2 id=charset-rule><span class=secno>8.2 </span><span class=content>
4487-
The <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> Rule</span><a class=self-link href=#charset-rule></a></h3>
4487+
The <span class=css data-link-type=maybe title=@charset>@charset</span> Rule</span><a class=self-link href=#charset-rule></a></h3>
44884488

4489-
<p> The <dfn class=css-code data-dfn-type=at-rule data-export="" id=at-ruledef-charset>@charset<a class=self-link href=#at-ruledef-charset></a></dfn> rule is a very special <a data-link-type=dfn href=#at-rule title=at-rule>at-rule</a> associated with determining the character encoding of the stylesheet.
4490-
In general, its grammar is:
4489+
<p> The @charset rule is an artifact of the algorithm used to <a data-link-type=dfn href=#determine-the-fallback-encoding title="determine the fallback encoding">determine the fallback encoding</a> for the stylesheet.
4490+
That algorithm looks for a specific byte sequence as the very first few bytes in the file,
4491+
which has the syntactic form of an @-rule.
4492+
Those bytes are not discarded from the input,
4493+
whether or not they influence the encoding actually used to process the stylesheet.
44914494

4492-
<pre class=prod><dfn class=css-code data-dfn-type=type data-export="" id=typedef-at-charset-rule>&lt;at-charset-rule&gt;<a class=self-link href=#typedef-at-charset-rule></a></dfn> = @charset <a class="production css-code" data-link-type=type href=http://dev.w3.org/csswg/css-values-3/#string-value title="<string>">&lt;string&gt;</a>;</pre>
4493-
<p> Additionally, an <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> rule is invalid if it is not at the top-level of a stylesheet,
4494-
or if it is not the very first rule of a stylesheet.
4495+
<p> Therefore, the stylesheet parser recognizes an @-rule with the general syntax
44954496

4496-
<p> <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> rules have an <dfn data-dfn-type=dfn data-noexport="" id=at-charset-encoding>encoding<a class=self-link href=#at-charset-encoding></a></dfn>,
4497-
given by the value of the <a class="production css-code" data-link-type=type href=http://dev.w3.org/csswg/css-values-3/#string-value title="<string>">&lt;string&gt;</a>.
4498-
4499-
<p> The <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> rule has <strong>no effect on a stylesheet</strong>.
4500-
4501-
<div class=note>
4502-
Confused?
4503-
Note that the preceding paragraph is talking about the <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> <strong><a data-link-type=dfn href=#at-rule title=at-rule>at-rule</a></strong>.
4504-
CSS looks for a byte sequence that looks like "@charset" at the beginning of the document
4505-
to receive encoding enformation.
4506-
This is thematically similar to other encoding sequences at the beginning of files,
4507-
like a byte-order mark (BOM) hinting at the type of Unicode encoding used,
4508-
a DOCTYPE in an HTML document,
4509-
or a magic string like "MANIFEST" at the start of an HTML manifest.
4510-
4511-
<p> This byte sequence happens to <em>look</em> like a normal CSS rule, however,
4512-
and for legacy reasons,
4513-
that rule is reflected as an <a data-link-type=dfn href=#at-rule title=at-rule>at-rule</a> in the CSS Object Model <a data-biblio-type=informative data-link-type=biblio href=#cssom title=cssom>[CSSOM]</a>.
4514-
However, <strong>that at-rule object does nothing</strong>;
4515-
modifying it has no effect on the stylesheet,
4516-
nor does creating a fresh one and inserting it into a stylesheet.
4517-
4518-
<p> Note that some syntax that qualifies as a valid <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> <a data-link-type=dfn href=#at-rule title=at-rule>at-rule</a>
4519-
is <strong>not</strong> a valid encoding declaration.
4520-
For example, since its argument is a string,
4521-
it can be written with single quotes around it.
4522-
This will create a valid <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> rule,
4523-
but it won’t be recognized by the encoding detection step,
4524-
as it’s not the exact byte sequence that the algorithm requires.
4525-
</div>
4497+
<pre class=prod><dfn class=css-code data-dfn-type=type data-export="" id=typedef-at-charset-rule>&lt;at-charset-rule&gt;<a class=self-link href=#typedef-at-charset-rule></a></dfn> = @charset <a class="production css-code" data-link-type=type href=http://dev.w3.org/csswg/css-values-3/#string-value title="<string>">&lt;string&gt;</a> ;</pre>
4498+
<p> and, for backward compatibility, includes it in the object model for the stylesheet.
4499+
Modifying, adding, or removing an @charset rule via the object model has no effect
4500+
(in particular it does *not* cause the stylesheet to be rescanned in a different encoding).
4501+
The @charset rule is invalid if it is not the very first, top-level rule in the stylesheet,
4502+
but it is parsed according to the normal syntax for @-rules,
4503+
which are less restrictive than the algorithm that determines the fallback encoding.
4504+
Therefore, an @charset rule may appear in the object model even if it was ignored by that algorithm.
4505+
(For instance, if it was written with extra whitespace or with single rather than double quotes.)
45264506

45274507

45284508

@@ -4737,10 +4717,10 @@ <h3 class="heading settled heading" data-level=10.3 id=changes-css21><span class
47374717

47384718
<p> <ul>
47394719
<li>
4740-
Only detect <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> rules in ASCII-compatible byte patterns.
4720+
Only detect <span class=css data-link-type=maybe title=@charset>@charset</span> rules in ASCII-compatible byte patterns.
47414721

47424722
<li>
4743-
Ignore <a class=css data-link-type=maybe href=#at-ruledef-charset title=@charset>@charset</a> rules that specify an ASCII-incompatible encoding,
4723+
Ignore <span class=css data-link-type=maybe title=@charset>@charset</span> rules that specify an ASCII-incompatible encoding,
47444724
as that would cause the rule itself to not decode properly.
47454725

47464726
<li>
@@ -5027,7 +5007,6 @@ <h2 class="no-num no-ref heading settled heading" id=index><span class=content>
50275007
<li>&lt;bad-url-token&gt;, <a href=#typedef-bad-url-token title="section 4">4</a>
50285008
<li>&lt;CDC-token&gt;, <a href=#typedef-cdc-token title="section 4">4</a>
50295009
<li>&lt;CDO-token&gt;, <a href=#typedef-cdo-token title="section 4">4</a>
5030-
<li>@charset, <a href=#at-ruledef-charset title="section 8.2">8.2</a>
50315010
<li>check if three code points would start an identifier, <a href=#check-if-three-code-points-would-start-an-identifier title="section 4.3.9">4.3.9</a>
50325011
<li>check if three code points would start a number, <a href=#check-if-three-code-points-would-start-a-number title="section 4.3.10">4.3.10</a>
50335012
<li>check if two code points are a valid escape, <a href=#check-if-two-code-points-are-a-valid-escape title="section 4.3.8">4.3.8</a>
@@ -5066,7 +5045,6 @@ <h2 class="no-num no-ref heading settled heading" id=index><span class=content>
50665045
<li>determine the fallback encoding, <a href=#determine-the-fallback-encoding title="section 3.2">3.2</a>
50675046
<li>digit, <a href=#digit title="section 4.2">4.2</a>
50685047
<li>&lt;dimension-token&gt;, <a href=#typedef-dimension-token title="section 4">4</a>
5069-
<li>encoding, <a href=#at-charset-encoding title="section 8.2">8.2</a>
50705048
<li>ending token, <a href=#ending-token title="section 5.4.7">5.4.7</a>
50715049
<li>end of the range, <a href=#unicode-range-end title="section 4">4</a>
50725050
<li>environment encoding, <a href=#environment-encoding0 title="section 3.3">3.3</a>

css-syntax/Overview.src.html

Lines changed: 18 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -3011,44 +3011,24 @@ <h3 id="style-rules">
30113011
<h3 id='charset-rule'>
30123012
The ''@charset'' Rule</h3>
30133013

3014-
The <dfn>@charset</dfn> rule is a very special <i>at-rule</i> associated with determining the character encoding of the stylesheet.
3015-
In general, its grammar is:
3016-
3017-
<pre class='prod'><dfn>&lt;at-charset-rule></dfn> = @charset <<string>>;</pre>
3018-
3019-
Additionally, an ''@charset'' rule is invalid if it is not at the top-level of a stylesheet,
3020-
or if it is not the very first rule of a stylesheet.
3021-
3022-
''@charset'' rules have an <dfn id="at-charset-encoding">encoding</dfn>,
3023-
given by the value of the <<string>>.
3024-
3025-
The ''@charset'' rule has <strong>no effect on a stylesheet</strong>.
3026-
3027-
<div class='note'>
3028-
Confused?
3029-
Note that the preceding paragraph is talking about the ''@charset'' <strong><a>at-rule</a></strong>.
3030-
CSS looks for a byte sequence that looks like "@charset" at the beginning of the document
3031-
to receive encoding enformation.
3032-
This is thematically similar to other encoding sequences at the beginning of files,
3033-
like a byte-order mark (BOM) hinting at the type of Unicode encoding used,
3034-
a DOCTYPE in an HTML document,
3035-
or a magic string like "MANIFEST" at the start of an HTML manifest.
3036-
3037-
This byte sequence happens to <em>look</em> like a normal CSS rule, however,
3038-
and for legacy reasons,
3039-
that rule is reflected as an <a>at-rule</a> in the CSS Object Model [[CSSOM]].
3040-
However, <strong>that at-rule object does nothing</strong>;
3041-
modifying it has no effect on the stylesheet,
3042-
nor does creating a fresh one and inserting it into a stylesheet.
3043-
3044-
Note that some syntax that qualifies as a valid ''@charset'' <a>at-rule</a>
3045-
is <strong>not</strong> a valid encoding declaration.
3046-
For example, since its argument is a string,
3047-
it can be written with single quotes around it.
3048-
This will create a valid ''@charset'' rule,
3049-
but it won't be recognized by the encoding detection step,
3050-
as it's not the exact byte sequence that the algorithm requires.
3051-
</div>
3014+
The @charset rule is an artifact of the algorithm used to <a>determine the fallback encoding</a> for the stylesheet.
3015+
That algorithm looks for a specific byte sequence as the very first few bytes in the file,
3016+
which has the syntactic form of an @-rule.
3017+
Those bytes are not discarded from the input,
3018+
whether or not they influence the encoding actually used to process the stylesheet.
3019+
3020+
Therefore, the stylesheet parser recognizes an @-rule with the general syntax
3021+
3022+
<pre class='prod'><dfn>&lt;at-charset-rule></dfn> = @charset <<string>> ;</pre>
3023+
3024+
and, for backward compatibility, includes it in the object model for the stylesheet.
3025+
Modifying, adding, or removing an @charset rule via the object model has no effect
3026+
(in particular it does *not* cause the stylesheet to be rescanned in a different encoding).
3027+
The @charset rule is invalid if it is not the very first, top-level rule in the stylesheet,
3028+
but it is parsed according to the normal syntax for @-rules,
3029+
which are less restrictive than the algorithm that determines the fallback encoding.
3030+
Therefore, an @charset rule may appear in the object model even if it was ignored by that algorithm.
3031+
(For instance, if it was written with extra whitespace or with single rather than double quotes.)
30523032

30533033

30543034

0 commit comments

Comments
 (0)