Thu, 07 Jan 2010 08:25:14 +0000
Upgrade wording throughout in response to hixie's comments about providing
better hooks for HTML5 and more normative wording.
<Hixie> fantasai: how should HTML5 refer to
http://dev.w3.org/csswg/css-style-attr/ ?
<Hixie> there doesn't seem to be a "hook" defined that I can use
<Hixie> e.g. i'd like to say "the style attribute is a CSS Styling Attribute.
[CSSSTYLE]" or something
<Hixie> where "CSS Styling Attribute" would be some term of art defined in that
draft
<Hixie> it also seems to be lacking in normative conformance criteria
<Hixie> for example, it doesn't seem to include the equivalent of this
requirement in html5:
<Hixie> "In user agents that support CSS, the attribute's value must be parsed
when the attribute is added or has its value changed, with its value
treated as the body (the part inside the curly brackets) of a declaration
block in a rule whose selector matches just the element on which the
attribute is set. All URLs in the value must be resolved relative to the
element when the attribute is parsed."
<Hixie> (the latter bit is required to handle changing base URIs, e.g.)
(will handle the last line in the next commit)
fantasai@1564 | 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> |
fantasai@1564 | 2 | <html lang="en"> |
fantasai@1564 | 3 | <head> |
fantasai@1564 | 4 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
fantasai@1610 | 5 | <title>CSS Styling Attribute Syntax Level 1</title> |
fantasai@1564 | 6 | <link rel="stylesheet" type="text/css" href="../default.css"> |
fantasai@1563 | 7 | |
fantasai@1564 | 8 | <link rel="stylesheet" type="text/css" href="http://www.w3.org/StyleSheets/TR/W3C-ED"> |
fantasai@1563 | 9 | </head> |
fantasai@1563 | 10 | |
fantasai@1564 | 11 | <div class="head"> |
fantasai@1564 | 12 | <!--logo--> |
fantasai@1563 | 13 | |
fantasai@1610 | 14 | <h1>CSS Styling Attribute Syntax Level 1</h1> |
fantasai@1563 | 15 | |
fantasai@1564 | 16 | <h2 class="no-num no-toc">[LONGSTATUS] [DATE]</h2> |
fantasai@1564 | 17 | <dl> |
fantasai@1564 | 18 | <dt>This version:</dt> |
fantasai@1564 | 19 | <!-- <dd><dd><a href="http://www.w3.org/TR/[YEAR]/WD-css-style-attr-[CDATE]/">http://www.w3.org/TR/[YEAR]/WD-css-style-attr-[CDATE]/</a></dd> --> |
fantasai@1564 | 20 | <dd><a href="http://dev.w3.org/csswg/css-style-attr/">http://dev.w3.org/csswg/css-style-attr/</a> |
fantasai@1564 | 21 | <dt>Latest version: |
fantasai@1564 | 22 | <dd><a href="http://www.w3.org/TR/css-style-attr">http://www.w3.org/TR/css-style-attr</a> |
fantasai@1564 | 23 | <dt>Previous version: |
fantasai@1564 | 24 | <dd><a href="http://www.w3.org/TR/2002/WD-css-style-attr-20020515">http://www.w3.org/TR/2002/WD-css-style-attr-20020515</a> |
fantasai@1564 | 25 | <dt>Editor: |
fantasai@1564 | 26 | <dd><a href="http://fantasai.inkedblade.net/contact/">Elika J. Etemad</a> |
fantasai@1564 | 27 | <dt>Previous Editors: |
fantasai@1564 | 28 | <dd><span lang="tr">Tantek Çelik</span> (<a href="http://www.microsoft.com/">Microsoft</a>), <<a href="mailto:tantekc@microsoft.com">tantekc@microsoft.com</a>> |
fantasai@1564 | 29 | <dd><a href="http://www.w3.org/People/Bos/">Bert Bos</a> (<a href="http://www.w3.org/">W3C</a>), <<a href="mailto:bert@w3.org">bert@w3.org</a>> |
fantasai@1564 | 30 | <dd>Marc Attinasi (AOL/Netscape), <<a href="mailto:attinasi@netscape.com">attinasi@netscape.com</a>> |
fantasai@1564 | 31 | </dl> |
fantasai@1564 | 32 | <!--begin-copyright--> |
fantasai@1564 | 33 | <p>[Here will be included the file "../copyright.inc"]</p> |
fantasai@1564 | 34 | <!--end-copyright--> |
fantasai@1563 | 35 | |
fantasai@1563 | 36 | <hr title="Separator for header"> |
fantasai@1563 | 37 | </div> |
fantasai@1563 | 38 | |
fantasai@1563 | 39 | <h2 class="no-num no-toc" id="abstract">Abstract</h2> |
fantasai@1563 | 40 | |
fantasai@1610 | 41 | <p>Markup languages such as HTML and SVG provide a styling attribute on most |
fantasai@1564 | 42 | elements, to hold a fragment of a style sheet that applies to those elements. |
fantasai@1564 | 43 | One of the possible style sheet languages is CSS. This draft describes the |
fantasai@1610 | 44 | syntax of the CSS fragment that can be used in the styling attribute. |
fantasai@1563 | 45 | |
fantasai@1563 | 46 | <h2 class="no-num no-toc" id="status">Status of this document</h2> |
fantasai@1564 | 47 | <!--status--> |
fantasai@1563 | 48 | |
fantasai@1564 | 49 | <h2 class="no-num no-toc" id="contents">Table of contents</h2> |
fantasai@1564 | 50 | <!--toc--> |
fantasai@1563 | 51 | |
fantasai@1564 | 52 | <h2 id="intro">Introduction</h2> |
fantasai@1563 | 53 | |
fantasai@1610 | 54 | <p>Some document formats have a <dfn>styling attribute</dfn> to permit |
fantasai@1610 | 55 | the author to directly apply style information to specific elements |
fantasai@1610 | 56 | in documents. If a document format defines a styling attribute and the |
fantasai@1610 | 57 | attribute accepts CSS as its value, then this specification defines this |
fantasai@1610 | 58 | <dfn>CSS styling attribute</dfn>'s syntax and interpretation. |
fantasai@1563 | 59 | |
fantasai@1564 | 60 | <div class="example"> |
fantasai@1564 | 61 | <p>The following example shows the use of the <code>style</code> attribute |
fantasai@1564 | 62 | in HTML:</p> |
fantasai@1564 | 63 | <pre><p style="<em>color: #090; line-height: 1.2</em>">...</p></pre> |
fantasai@1564 | 64 | </div> |
fantasai@1563 | 65 | |
fantasai@1565 | 66 | <h2 id="conformance">Conformance</h2> |
fantasai@1565 | 67 | |
fantasai@1610 | 68 | <p>A document or implementation cannot conform to CSS Styling Attribute Syntax |
fantasai@1610 | 69 | Level 1 alone, but can claim conformance to CSS Styling Attribute Syntax Level 1 |
fantasai@1571 | 70 | if it satisfies the conformance requirements in this specification when |
fantasai@1610 | 71 | implementing CSS together with styling attribute handling as defined in a |
fantasai@1610 | 72 | document language that has CSS styling attributes.</p> |
fantasai@1571 | 73 | |
fantasai@1610 | 74 | <p>Conformance to CSS Styling Attribute Syntax Level 1 is defined for two |
fantasai@1610 | 75 | classes: |
fantasai@1571 | 76 | <dl> |
fantasai@1571 | 77 | <dt><dfn>document</dfn></dt> |
fantasai@1610 | 78 | <dd>A document represented in a document language that defines a styling |
fantasai@1571 | 79 | attribute for one or more of its elements. |
fantasai@1571 | 80 | <dt><dfn>interpreter</dfn></dt> |
fantasai@1571 | 81 | <dd>Someone or something that interprets the semantics of a document and |
fantasai@1571 | 82 | its associated style information. |
fantasai@1571 | 83 | (Most CSS <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">user |
fantasai@1571 | 84 | agents</a> fall under this category.)</dd> |
fantasai@1571 | 85 | </dl> |
fantasai@1571 | 86 | |
fantasai@1565 | 87 | <p>The conformance requirements are expressed with a combination of |
fantasai@1565 | 88 | descriptive assertions and RFC 2119 terminology. The key words "MUST", |
fantasai@1565 | 89 | "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT", |
fantasai@1565 | 90 | "RECOMMENDED", "MAY", and "OPTIONAL" in the normative parts of this |
fantasai@1565 | 91 | document are to be interpreted as described in RFC 2119. |
fantasai@1565 | 92 | However, for readability, these words do not appear in all uppercase |
fantasai@1565 | 93 | letters in this specification. All of the text of this specification is |
fantasai@1565 | 94 | normative except sections explicitly marked as non-normative, examples, |
fantasai@1565 | 95 | and notes. [[!RFC2119]]</p> |
fantasai@1565 | 96 | |
fantasai@1565 | 97 | <p>Examples in this specification are introduced with the words "for example" |
fantasai@1565 | 98 | or are set apart from the normative text with <code>class="example"</code>, |
fantasai@1565 | 99 | like this: |
fantasai@1565 | 100 | |
fantasai@1565 | 101 | <div class="example"> |
fantasai@1565 | 102 | <p>This is an example of an informative example.</p> |
fantasai@1565 | 103 | </div> |
fantasai@1565 | 104 | |
fantasai@1565 | 105 | <p>Informative notes begin with the word "Note" and are set apart from the |
fantasai@1565 | 106 | normative text with <code>class="note"</code>, like this: |
fantasai@1565 | 107 | |
fantasai@1565 | 108 | <p class="note">Note, this is an informative note.</p> |
fantasai@1565 | 109 | |
fantasai@1610 | 110 | <h2 id="syntax">Syntax and Parsing</h2> |
fantasai@1610 | 111 | |
fantasai@1610 | 112 | <p>The value of the styling attribute must match the syntax of the contents of |
fantasai@1610 | 113 | a CSS <a href="http://www.w3.org/TR/CSS21/syndata.html#rule-sets">declaration |
fantasai@1610 | 114 | block</a>. The interpreter must parse the styling attribute's value using the |
fantasai@1610 | 115 | same forward-compatible parsing rules that apply to parsing declaration block |
fantasai@1610 | 116 | contents in a normal CSS style sheet. See |
fantasai@1610 | 117 | <a href="http://www.w3.org/TR/CSS21/syndata.html">chapter 4 of the CSS2.1 |
fantasai@1610 | 118 | specification</a>. [[!CSS21]] |
fantasai@1610 | 119 | |
fantasai@1610 | 120 | <p class="note">Note that because there is no open brace delimiting the |
fantasai@1610 | 121 | declaration list in the CSS styling attribute syntax, a close brace |
fantasai@1610 | 122 | (<code>}</code>) in the styling attribute's value does not terminate the |
fantasai@1610 | 123 | style data: it is merely an invalid token.</p> |
fantasai@1610 | 124 | |
fantasai@1610 | 125 | <h2 id="grammar">Grammar</h2> |
fantasai@1610 | 126 | |
fantasai@1610 | 127 | <p>The syntax of the CSS fragment that is allowed as the CSS styling |
fantasai@1610 | 128 | attribute's value is formally specified as follows: |
fantasai@1610 | 129 | |
fantasai@1610 | 130 | <pre> |
fantasai@1610 | 131 | inline-stylesheet |
fantasai@1610 | 132 | : S* declaration-list |
fantasai@1610 | 133 | ; |
fantasai@1610 | 134 | |
fantasai@1610 | 135 | declaration-list |
fantasai@1610 | 136 | : declaration [ ';' S* declaration ]* |
fantasai@1610 | 137 | ; |
fantasai@1610 | 138 | </pre> |
fantasai@1610 | 139 | |
fantasai@1610 | 140 | <p>Please refer to the grammar in <a href="http://www.w3.org/TR/CSS21/grammar.html">appendix D |
fantasai@1610 | 141 | of the CSS2.1 specification</a> [[!CSS21]] for the definition of the symbols |
fantasai@1610 | 142 | not defined here. |
fantasai@1610 | 143 | |
fantasai@1610 | 144 | <h2 id="interpret">Cascading and Interpretation</h2> |
fantasai@1610 | 145 | |
fantasai@1610 | 146 | <p>The declarations in a styling attribute apply to the element to which |
fantasai@1610 | 147 | the attribute belongs. CSS2.1 <a href="/TR/CSS21/cascade.html#specificity">defines</a> |
fantasai@1610 | 148 | how style sheets and styling attributes are cascaded together. [[!CSS21]] |
fantasai@1610 | 149 | Relative URLs in the style data must be resolved relative to the styling |
fantasai@1610 | 150 | attribute's element (or to the document if per-element resolution is not |
fantasai@1610 | 151 | defined). |
fantasai@1610 | 152 | |
fantasai@1610 | 153 | <p>Aside from the differences in cascading, the declarations in a styling |
fantasai@1610 | 154 | attribute must be interpreted exactly as if they were given in a CSS |
fantasai@1610 | 155 | style rule that applies to the element. |
fantasai@1610 | 156 | |
fantasai@1610 | 157 | <p>The CSS Working Group strongly recommends that document languages do |
fantasai@1610 | 158 | not allow multiple CSS styling attributes on a single element. If a document |
fantasai@1610 | 159 | language allows multiple CSS styling attributes, each must be parsed |
fantasai@1610 | 160 | independently and treated as a separate style rule, the ordering of which |
fantasai@1610 | 161 | should be defined by the document language, else is undefined. |
fantasai@1610 | 162 | |
fantasai@1564 | 163 | <h2 id="ack">Acknowledgments</h2> |
fantasai@1563 | 164 | |
fantasai@1563 | 165 | <p>Thanks to feedback from Daniel Glazman, Ian Hickson, Eric A. Meyer, |
fantasai@1563 | 166 | Björn Höhrmann. |
fantasai@1563 | 167 | |
fantasai@1564 | 168 | <h2 id="references">References |
fantasai@1563 | 169 | |
fantasai@1564 | 170 | <h3 class="no-num" id="normative-references">Normative references</h3> |
fantasai@1563 | 171 | |
fantasai@1564 | 172 | <!--begin-normative--> |
fantasai@1564 | 173 | <p>[Here will be inserted the file "normative.inc"]</p> |
fantasai@1564 | 174 | <!--end-normative--> |
fantasai@1563 | 175 | |
fantasai@1564 | 176 | <h3 class="no-num" id="informative-references">Informative references</h3> |
fantasai@1563 | 177 | |
fantasai@1564 | 178 | <!--begin-informative--> |
fantasai@1564 | 179 | <p>[Here will be inserted the file "informative.inc"]</p> |
fantasai@1564 | 180 | <!--end-informative--> |
fantasai@1563 | 181 | |
fantasai@1563 | 182 | </body> |
fantasai@1563 | 183 | </html> |
fantasai@1563 | 184 | <!-- Keep this comment at the end of the file |
fantasai@1563 | 185 | Local variables: |
fantasai@1563 | 186 | mode: sgml |
fantasai@1563 | 187 | sgml-declaration:"~/SGML/HTML4.decl" |
fantasai@1563 | 188 | sgml-default-doctype-name:"html" |
fantasai@1563 | 189 | sgml-minimize-attributes:t |
fantasai@1563 | 190 | sgml-nofill-elements:("pre" "style" "br") |
fantasai@1563 | 191 | End: |
fantasai@1563 | 192 | --> |