Mon, 04 Feb 2013 12:42:58 -0700
[cssom] Make LinkStyle.style nullable; editorial clean up.
glenn@4922 | 1 | <!doctype html> |
annevk@4900 | 2 | <html lang="en-US"> |
annevk@4900 | 3 | <head> |
glenn@4922 | 4 | <meta charset=utf-8> |
glenn@4922 | 5 | <title>CSS Object Model (CSSOM)</title> |
glenn@6229 | 6 | <link rel="stylesheet" href="cssom.css"> |
annevk@4900 | 7 | <link rel="stylesheet" href="http://www.w3.org/StyleSheets/TR/W3C-[STATUS]"> |
annevk@4900 | 8 | </head> |
annevk@4900 | 9 | <body class="draft"> |
annevk@4900 | 10 | <div class="head"> |
glenn@4923 | 11 | <!--logo--> |
glenn@4923 | 12 | |
glenn@6229 | 13 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 14 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 15 | |
glenn@4922 | 16 | <h1 id="cssom">CSS Object Model (CSSOM)</h1> |
glenn@4922 | 17 | |
glenn@6229 | 18 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 19 | |
glenn@4922 | 20 | <h2 class="no-num no-toc" id="w3c-doctype">[LONGSTATUS] [DATE: 3 August 2002]</h2> |
annevk@4900 | 21 | |
annevk@4900 | 22 | <dl> |
annevk@4900 | 23 | |
annevk@4900 | 24 | <dt>This Version:</dt> |
glenn@5055 | 25 | <dd class=dontpublish><a href="http://dvcs.w3.org/hg/csswg/raw-file/tip/cssom/Overview.html">http://dvcs.w3.org/hg/csswg/raw-file/tip/cssom/Overview.html</a></dd> |
annevk@4900 | 26 | <dd class=publish><a href="[VERSION]">[VERSION]</a></dd> |
annevk@4900 | 27 | |
glenn@4922 | 28 | <dt class=dontpublish>Participate:</dt> |
glenn@6229 | 29 | <dd class=dontpublish><a href="mailto:www-style@w3.org?subject==%5Bcssom%5D%20">www-style@w3.org</a> (<a href="http://lists.w3.org/Archives/Public/www-style/">archives</a>)</dd> |
glenn@6229 | 30 | <dd class=dontpublish><a href="https://www.w3.org/Bugs/Public/enter_bug.cgi?product=CSS&component=CSSOM">File a bug</a></dd> |
glenn@6529 | 31 | <dd class=dontpublish><a href="irc://irc.w3.org/css">IRC: #css on W3C</a></dd> |
glenn@4922 | 32 | |
annevk@4900 | 33 | <dt class=publish>Latest Version:</dt> |
annevk@4900 | 34 | <dd class=publish><a href="[LATEST]">[LATEST]</a></dd> |
annevk@4900 | 35 | |
annevk@4900 | 36 | <dt class=publish>Latest Editor's draft:</dt> |
glenn@5055 | 37 | <dd class=publish><a href="http://dvcs.w3.org/hg/csswg/raw-file/tip/cssom/Overview.html">http://dvcs.w3.org/hg/csswg/raw-file/tip/cssom/Overview.html</a></dd> |
annevk@4900 | 38 | |
annevk@4910 | 39 | <dt class=dontpublish>Previous Version:</dt> |
glenn@4923 | 40 | <dd class=dontpublish><a href="http://www.w3.org/TR/2011/WD-cssom-20110712/">http://www.w3.org/TR/2011/WD-cssom-20110712/</a></dd> |
annevk@4910 | 41 | <dd class=dontpublish><a href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/">http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/</a></dd> |
annevk@4900 | 42 | |
glenn@4922 | 43 | <dt>Editors:</dt> |
glenn@4922 | 44 | <dd><a href="http://www.w3.org/wiki/User:Gadams">Glenn Adams</a> |
glenn@4922 | 45 | (<a href="http://www.cox.com/">Cox Communications, Inc.</a>) |
glenn@4922 | 46 | <<a href="mailto:glenn.adams@cox.com">glenn.adams@cox.com</a>></dd> |
glenn@6229 | 47 | <dd><a>Shane Stephens</a> |
glenn@4922 | 48 | (<a href="http://www.google.com/">Google, Inc.</a>) |
glenn@4922 | 49 | <<a href="mailto:shans@google.com">shans@google.com</a>></dd> |
glenn@4922 | 50 | |
glenn@4922 | 51 | <dt>Previous Editor:</dt> |
annevk@4900 | 52 | <dd><a href="http://annevankesteren.nl/">Anne van Kesteren</a> |
annevk@4900 | 53 | (<a href="http://www.opera.com/">Opera Software ASA</a>) |
annevk@4900 | 54 | <<a href="mailto:annevk@opera.com">annevk@opera.com</a>></dd> |
annevk@4900 | 55 | </dl> |
annevk@4905 | 56 | |
glenn@6344 | 57 | <!--copyright--> |
glenn@4922 | 58 | |
annevk@4900 | 59 | </div> |
annevk@4900 | 60 | |
annevk@4905 | 61 | <hr class="top"> |
annevk@4900 | 62 | |
glenn@6229 | 63 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 64 | |
annevk@4900 | 65 | <h2 class="no-num no-toc" id="abstract">Abstract</h2> |
annevk@4900 | 66 | |
annevk@4900 | 67 | <p>CSSOM defines APIs (including generic parsing and serialization rules) |
annevk@4900 | 68 | for Media Queries, Selectors, and of course CSS itself.</p> |
annevk@4900 | 69 | |
glenn@6229 | 70 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 71 | |
annevk@4900 | 72 | <h2 class="no-num no-toc" id="sotd">Status of this Document</h2> |
annevk@4900 | 73 | |
glenn@6257 | 74 | <p>This is a public copy of the editors' draft. It is provided for discussion only and may change at any moment. |
glenn@6257 | 75 | Its publication here does not imply endorsement of its contents by W3C or by the CSS Working Group. Don't cite |
glenn@6257 | 76 | this document other than as work in progress.</p> |
glenn@6257 | 77 | |
glenn@6257 | 78 | <p class="note">Implementers should note well that this specification is an ongoing effort to sort out |
glenn@6794 | 79 | what has been widely implemented and deployed from <span data-anolis-ref>DOM2STYLE</span> as well as common extensions thereto, some details |
glenn@6257 | 80 | of which are currently interoperable and others which are not currently interoperable. As this specification moves |
glenn@6257 | 81 | forward, it is hoped that these differences will be resolved and an unambiguous and adequate consensus-based |
glenn@6257 | 82 | specification will emerge.</p> |
glenn@6257 | 83 | |
annevk@4905 | 84 | <p><em>This section describes the status of this document at the time of |
annevk@4905 | 85 | its publication. Other documents may supersede this document. A list of |
annevk@4905 | 86 | current W3C publications and the latest revision of this technical report |
annevk@4905 | 87 | can be found in the |
annevk@4905 | 88 | <a href="http://www.w3.org/TR/">W3C technical reports index at http://www.w3.org/TR/.</a></em> |
annevk@4905 | 89 | |
glenn@6245 | 90 | <p class="dontpublish">This is the [DATE: 3 August 2002] [LONGSTATUS] of CSSOM. Please send comments to |
glenn@4922 | 91 | <a href="mailto:www-style@w3.org?subject=%5Bcssom%5D%20">www-style@w3.org</a> |
glenn@4922 | 92 | (<a href="http://lists.w3.org/Archives/Public/www-style/">archived</a>) |
glenn@4922 | 93 | with <samp>[cssom]</samp> at the start of the subject line. |
annevk@4905 | 94 | |
glenn@6245 | 95 | <p class="publish">This is the [DATE] First Public Working Draft of CSSOM, produced by the |
annevk@4905 | 96 | <a href="http://www.w3.org/Style/CSS/members">CSS Working Group</a> (part |
annevk@4905 | 97 | of the <a href="http://www.w3.org/Style/">Style Activity</a>). |
annevk@4910 | 98 | <!--XXX remove "First Public" after initial publication --> |
annevk@4905 | 99 | |
annevk@4905 | 100 | <p>This document was produced by a group operating under the |
annevk@4905 | 101 | <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February 2004 W3C Patent Policy</a>. |
annevk@4905 | 102 | W3C maintains a |
annevk@4905 | 103 | <a href="http://www.w3.org/2004/01/pp-impl/32061/status" rel=disclosure>public list of any patent disclosures</a> |
annevk@4905 | 104 | made in connection with the deliverables of the group; that page also |
annevk@4905 | 105 | includes instructions for disclosing a patent. An individual who has |
annevk@4905 | 106 | actual knowledge of a patent which the individual believes contains |
annevk@4905 | 107 | <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential Claim(s)</a> |
annevk@4905 | 108 | must disclose the information in accordance with |
annevk@4905 | 109 | <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section 6 of the W3C Patent Policy</a>.</p> |
annevk@4900 | 110 | |
glenn@6229 | 111 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 112 | |
annevk@4900 | 113 | <h2 class="no-num no-toc" id="toc">Table of Contents</h2> |
annevk@4900 | 114 | |
annevk@4900 | 115 | <!--toc--> |
annevk@4900 | 116 | |
glenn@6229 | 117 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 118 | |
annevk@4900 | 119 | <h2 id="introduction">Introduction</h2> |
annevk@4900 | 120 | |
glenn@6794 | 121 | <p>This document formally specifies the core features of the CSS Object Model (CSSOM). Other documents in the CSSOM family of specifications |
glenn@6794 | 122 | as well as other CSS related specifications define extensions to these core features.</p> |
annevk@4900 | 123 | |
glenn@6794 | 124 | <p>The core features of the CSSOM are oriented towards providing basic capabilities to author-defined scripts to permit access to |
glenn@6794 | 125 | and manipulation of style related state information and processes.</p> |
glenn@6229 | 126 | |
glenn@6794 | 127 | <p>The features defined below are fundamentally based on prior specifications of the W3C DOM Working Group, primarily |
glenn@6794 | 128 | <span data-anolis-ref>DOM2STYLE</span>. The purposes of the present document are (1) to improve on that prior work by providing |
glenn@6794 | 129 | more technical specificity (so as to improve testability and interoperability), (2) to deprecate or remove certain less-widely implemented |
glenn@6794 | 130 | features no longer considered to be essential in this context, and (3) to newly specify certain extensions that have been |
glenn@6794 | 131 | or expected to be widely implemented.</p> |
annevk@4900 | 132 | |
glenn@6794 | 133 | <p>A full list of the changes to API signatures can be found in <a href="#changes-from-dom2"><cite>Changes from DOM-2 Style</cite></a>.</p> |
annevk@4900 | 134 | |
glenn@6229 | 135 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 136 | |
annevk@4902 | 137 | <h2>Conformance</h2> |
annevk@4902 | 138 | |
glenn@6229 | 139 | <p>All diagrams, examples, and notes in this specification are |
glenn@6229 | 140 | non-normative, as are all sections explicitly marked non-normative. |
glenn@6229 | 141 | Everything else in this specification is normative. |
glenn@6229 | 142 | |
glenn@6229 | 143 | <p>The key words "MUST", "MUST NOT", "REQUIRED", <!--"SHALL", "SHALL |
glenn@6229 | 144 | NOT",--> "SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and |
glenn@6229 | 145 | "OPTIONAL" in the normative parts of this document are to be |
glenn@6229 | 146 | interpreted as described in RFC2119. For readability, these words do |
glenn@6229 | 147 | not appear in all uppercase letters in this specification. |
glenn@6229 | 148 | <span data-anolis-ref>RFC2119</span> |
glenn@6229 | 149 | |
glenn@6229 | 150 | <p>Requirements phrased in the imperative as part of algorithms |
glenn@6229 | 151 | (such as "strip any leading space characters" or "return false and |
glenn@6229 | 152 | terminate these steps") are to be interpreted with the meaning of the |
glenn@6229 | 153 | key word ("must", "should", "may", etc) used in introducing the |
glenn@6229 | 154 | algorithm. |
glenn@6229 | 155 | |
glenn@6229 | 156 | <p>Conformance requirements phrased as algorithms or specific steps |
glenn@6229 | 157 | may be implemented in any manner, so long as the end result is |
glenn@6229 | 158 | equivalent. (In particular, the algorithms defined in this |
glenn@6229 | 159 | specification are intended to be easy to follow, and not intended to |
glenn@6229 | 160 | be performant.) |
glenn@6229 | 161 | |
glenn@6229 | 162 | <p id="hardwareLimitations">User agents may impose |
glenn@6229 | 163 | implementation-specific limits on otherwise unconstrained inputs, |
glenn@6229 | 164 | e.g. to prevent denial of service attacks, to guard against running |
glenn@6229 | 165 | out of memory, or to work around platform-specific limitations. |
glenn@6229 | 166 | |
glenn@6229 | 167 | <p>When a method or an attribute is said to call another method or attribute, the user agent must invoke its internal API for that attribute or method so that e.g. the author can't change the behavior by overriding attributes or methods with custom properties or functions in ECMAScript. |
glenn@6229 | 168 | |
glenn@6229 | 169 | <p>Unless otherwise stated, string comparisons are done in a |
glenn@6229 | 170 | <span data-anolis-spec=dom>case-sensitive</span> manner. |
glenn@6229 | 171 | |
glenn@6229 | 172 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 173 | |
glenn@6229 | 174 | <h2 id="terminology">Terminology</h2> |
glenn@6229 | 175 | |
glenn@6794 | 176 | <p>This specification employs certain terminology from the following documents: |
glenn@6229 | 177 | <cite>DOM4</cite>, |
glenn@6229 | 178 | <cite>HTML</cite>, |
glenn@6229 | 179 | <cite>Associating Style Sheets with XML documents</cite> |
glenn@6229 | 180 | and |
glenn@6229 | 181 | <cite>XML</cite> |
glenn@6229 | 182 | <span data-anolis-ref>DOM</span> |
glenn@6229 | 183 | <span data-anolis-ref>HTML</span> |
glenn@6229 | 184 | <span data-anolis-ref>XMLSS</span> |
glenn@6794 | 185 | <span data-anolis-ref>XML</span>. |
glenn@6229 | 186 | |
glenn@6229 | 187 | <p>When this specification talks about object |
glenn@6229 | 188 | <code><var>A</var></code> where <code><var>A</var></code> is actually an interface, it generally means an object implementing interface |
glenn@6229 | 189 | <code><var>A</var></code>.</p> |
glenn@6229 | 190 | |
glenn@6794 | 191 | <p>The term <dfn id="whitespace">whitespace</dfn> is used as defined in <span data-anolis-ref>CSS</span>. |
glenn@6229 | 192 | |
glenn@6933 | 193 | <p>The terms <dfn id="set">set</dfn> and <dfn id="clear">clear</dfn> to refer to the <code>true</code> and |
glenn@6933 | 194 | <code>false</code> values of binary flags or variables, respectively. These terms are also used as verbs in which case they refer to |
glenn@6933 | 195 | mutating some value to make it <code>true</code> or <code>false</code>, respectively.</p> |
glenn@6933 | 196 | |
glenn@6229 | 197 | <!-- ........................................................................................................................ --> |
glenn@6229 | 198 | <!-- ........................................................................................................................ --> |
annevk@4900 | 199 | |
annevk@4900 | 200 | <h3>Common Serializing Idioms</h3> |
annevk@4900 | 201 | |
glenn@6524 | 202 | <p>To <dfn>escape a character</dfn> means to create a string of |
annevk@4900 | 203 | "<code>\</code>" (U+005C), followed by the character.</p> |
annevk@4900 | 204 | |
glenn@6524 | 205 | <p>To <dfn>escape a character as code point</dfn> means to create a |
annevk@4900 | 206 | string of "<code>\</code>" (U+005C), followed by the Unicode code point as |
annevk@4900 | 207 | the smallest possible number of hexadecimal digits in the range 0-9 a-f |
annevk@4900 | 208 | (U+0030 to U+0039 and U+0061 to U+0066) to represent the code point in |
glenn@6934 | 209 | base 16, followed by a single SPACE (U+0020).</p> |
annevk@4900 | 210 | |
annevk@4900 | 211 | <p>To <dfn>serialize an identifier</dfn> means to create a string represented |
annevk@4900 | 212 | by the concatenation of, for each character of the identifier:</p> |
annevk@4900 | 213 | |
annevk@4900 | 214 | <ul> |
glenn@6942 | 215 | <li>If the character is NULL (U+0000), then <span data-anolis-spec=dom title=concept-throw>throw</span> an |
glenn@6933 | 216 | <code data-anolis-spec=dom>InvalidCharacterError</code> exception and terminate these steps.</li> |
glenn@6933 | 217 | <li>If the character is in the range [\1-\1f] (U+0001 to U+001F) or |
glenn@6933 | 218 | [\7f-\9f] (U+007F to U+009F), then the character |
glenn@6524 | 219 | <span title="escape a character as code point">escaped as code point</span>.</li> |
glenn@6933 | 220 | <li>If the character is the first character and is in the range [0-9] |
glenn@6933 | 221 | (U+0030 to U+0039), then the character |
glenn@6524 | 222 | <span title="escape a character as code point">escaped as code point</span>.</li> |
glenn@6933 | 223 | <li>If the character is the second character and is in the range [0-9] |
annevk@4900 | 224 | (U+0030 to U+0039) and the first character is a "<code>-</code>" |
glenn@6933 | 225 | (U+002D), then the character |
glenn@6524 | 226 | <span title="escape a character as code point">escaped as code point</span>.</li> |
annevk@4900 | 227 | <li>If the character is the second character and is "<code>-</code>" |
glenn@6933 | 228 | (U+002D) and the first character is "<code>-</code>" as well, then the |
glenn@6524 | 229 | <span title="escape a character">escaped</span> character.</li> |
annevk@4900 | 230 | <li>If the character is not handled by one of the above rules and is |
annevk@4900 | 231 | greater than or equal to U+0080, is "<code>-</code>" (U+002D) or |
glenn@6933 | 232 | "<code>_</code>" (U+005F), or is in one of the ranges [0-9] (U+0030 to |
glenn@6933 | 233 | U+0039), [A-Z] (U+0041 to U+005A), or [a-z] (U+0061 to U+007A), then the character |
annevk@4900 | 234 | itself.</li> |
glenn@6524 | 235 | <li>Otherwise, the <span title="escape a character">escaped</span> |
annevk@4900 | 236 | character.</li> |
annevk@4900 | 237 | </ul> |
annevk@4900 | 238 | |
annevk@4900 | 239 | <p>To <dfn>serialize a string</dfn> means to create a string represented |
annevk@4900 | 240 | by '<code>"</code>' (U+0022), followed by the result of applying the rules |
annevk@4900 | 241 | below to each character of the given string, followed by |
annevk@4900 | 242 | '<code>"</code>' (U+0022):</p> |
annevk@4900 | 243 | |
annevk@4900 | 244 | <ul> |
glenn@6942 | 245 | <li>If the character is NULL (U+0000), then <span data-anolis-spec=dom title=concept-throw>throw</span> an |
glenn@6933 | 246 | <code data-anolis-spec=dom>InvalidCharacterError</code> exception and terminate these steps.</li> |
glenn@6933 | 247 | <li>If the character is in the range [\1-\1f] (U+0001 to U+001F) or [\7f-\9f] (U+007F to |
glenn@6933 | 248 | U+009F), the character <span title="escape a character as code point">escaped as code point</span>.</li> |
annevk@4900 | 249 | <li>If the character is '<code>"</code>' (U+0022) or '<code>\</code>' |
glenn@6524 | 250 | (U+005C), the <span title="escape a character">escaped</span> character.</li> |
annevk@4900 | 251 | <li>Otherwise, the character itself.</li> |
annevk@4900 | 252 | </ul> |
annevk@4900 | 253 | |
annevk@4900 | 254 | <p class="note">"<code>'</code>" (U+0027) is not escaped because strings |
annevk@4900 | 255 | are always serialized with '<code>"</code>' (U+0022).</p> |
annevk@4900 | 256 | |
annevk@4900 | 257 | <p>To <dfn>serialize a URL</dfn> means to create a string represented by |
glenn@6229 | 258 | "<code>url(</code>", followed by the |
annevk@4900 | 259 | <span title="serialize a string">string escaped</span> value of the given |
annevk@4900 | 260 | string, followed by "<code>)</code>".</p> |
annevk@4900 | 261 | |
annevk@4900 | 262 | <p>To <dfn>serialize a comma-separated list</dfn> concatenate all items of |
glenn@6933 | 263 | the list in list order while separating them by "<code>, </code>", i.e., |
glenn@6933 | 264 | COMMA (U+002C) followed by a single SPACE (U+0020).</p> |
annevk@4900 | 265 | |
annevk@4900 | 266 | <p>To <dfn>serialize a whitespace-separated list</dfn> concatenate all |
glenn@6933 | 267 | items of the list in list order while separating them by "<code> </code>", i.e., |
glenn@6933 | 268 | a single SPACE (U+0020).</p> |
glenn@6933 | 269 | |
glenn@6933 | 270 | <p class="note">When serializing a list according to the above rules, |
glenn@6933 | 271 | extraneous whitespace is not inserted prior to the first item or subsequent to |
glenn@6933 | 272 | the last item. Unless otherwise specified, an empty list is serialized as the |
glenn@6933 | 273 | empty string.</p> |
annevk@4900 | 274 | |
glenn@6229 | 275 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 276 | |
annevk@4900 | 277 | <h2>Media Queries</h2> |
annevk@4900 | 278 | |
annevk@4900 | 279 | <p>Media queries are defined by the Media Queries specification. This |
annevk@4900 | 280 | section defines various concepts around media queries, including their API |
annevk@4900 | 281 | and serialization form.</p> |
annevk@4900 | 282 | |
annevk@4900 | 283 | <!-- XXX ref --> |
annevk@4900 | 284 | |
glenn@6229 | 285 | <!-- ........................................................................................................................ --> |
glenn@6229 | 286 | <!-- ........................................................................................................................ --> |
glenn@6229 | 287 | |
annevk@4900 | 288 | <h3>Parsing Media Queries</h3> |
annevk@4900 | 289 | |
annevk@4900 | 290 | <p>To |
annevk@4900 | 291 | <dfn id="parse-a-media-query-list">parse a media query list</dfn> for a |
glenn@6229 | 292 | given string <var>s</var> into a media query list is defined in |
annevk@4900 | 293 | the Media Queries specification. Return the list of one or more media |
annevk@4900 | 294 | queries that the algorithm defined there gives.</p> <!-- XXX ref --> |
annevk@4900 | 295 | |
annevk@4900 | 296 | <p class="note">A media query that ends up being "ignored" will turn |
glenn@6229 | 297 | into "<code>not all</code>".</p> |
annevk@4900 | 298 | |
annevk@4900 | 299 | <p>To |
annevk@4900 | 300 | <dfn id="parse-a-media-query">parse a media query</dfn> for a given string |
glenn@6229 | 301 | <var>s</var> means to follow the |
glenn@6933 | 302 | <span>parse a media query list</span> steps and return <code>null</code> if more |
annevk@4900 | 303 | than one media query is returned or a media query if a |
annevk@4900 | 304 | single media query is returned.</p> |
annevk@4900 | 305 | |
annevk@4900 | 306 | <p class="note">Again, a media query that ends up being "ignored" will |
glenn@6229 | 307 | turn into "<code>not all</code>".</p> |
glenn@6229 | 308 | |
glenn@6229 | 309 | <!-- ........................................................................................................................ --> |
annevk@4900 | 310 | |
annevk@4900 | 311 | <h3>Serializing Media Queries</h3> |
annevk@4900 | 312 | |
annevk@4900 | 313 | <p>To |
annevk@4900 | 314 | <dfn id="serialize-a-media-query-list">serialize a media query list</dfn> |
annevk@4900 | 315 | run these steps:</p> |
annevk@4900 | 316 | |
annevk@4900 | 317 | <ol> |
annevk@4900 | 318 | <li><p>If the media query list is empty return the empty string and |
annevk@4900 | 319 | terminate these steps.</p></li> |
annevk@4900 | 320 | |
annevk@4900 | 321 | <li><p><span title="serialize a media query">Serialize</span> each |
annevk@4900 | 322 | media query in the list of media queries, sort them in lexicographical |
annevk@4900 | 323 | order, and then |
annevk@4900 | 324 | <span title="serialize a comma-separated list">serialize</span> the |
annevk@4900 | 325 | list.</p></li> |
annevk@4900 | 326 | </ol> |
annevk@4900 | 327 | |
annevk@4900 | 328 | <p>To |
annevk@4900 | 329 | <dfn id="serialize-a-media-query">serialize a media query</dfn> let |
glenn@6229 | 330 | <var>s</var> be the empty string, run the steps below, and |
glenn@6229 | 331 | finally return <var>s</var>:</p> |
annevk@4900 | 332 | |
annevk@4900 | 333 | <ol> |
annevk@4900 | 334 | <li><p>If the media query is negated append "<code>not</code>", followed |
glenn@6934 | 335 | by a single SPACE (U+0020), to <var>s</var>.</p></li> |
glenn@6229 | 336 | |
glenn@6229 | 337 | <li><p>Let <var>type</var> be the media type of the media query, |
annevk@4900 | 338 | <span title="serialize an identifier">escaped</span> and |
annevk@4914 | 339 | <span data-anolis-spec=dom>converted to ASCII lowercase</span>.</p></li> |
annevk@4900 | 340 | |
annevk@4900 | 341 | <li><p>If the media query does not contain media features append |
glenn@6229 | 342 | <var>type</var>, to <var>s</var>, |
glenn@6229 | 343 | then return <var>s</var> and terminate this algorithm.</p></li> |
glenn@6229 | 344 | |
glenn@6229 | 345 | <li><p>If <var>type</var> is not "<code>all</code>" or if the |
glenn@6229 | 346 | media query is negated append <var>type</var>, followed by a |
glenn@6934 | 347 | single SPACE (U+0020), followed by "<code>and</code>", followed by a single SPACE |
glenn@6229 | 348 | (U+0020), to <var>s</var>.</p></li> |
annevk@4900 | 349 | |
annevk@4900 | 350 | <li><p>Sort the media features in lexicographical order.</p></li> |
annevk@4900 | 351 | |
annevk@4900 | 352 | <li> |
annevk@4900 | 353 | <p>Then, for each media feature:</p> |
annevk@4900 | 354 | |
annevk@4900 | 355 | <ol> |
annevk@4900 | 356 | <li>Append a "<code>(</code>" (U+0028), followed by the media feature |
annevk@4914 | 357 | name, <span data-anolis-spec=dom>converted to ASCII lowercase</span>, |
glenn@6229 | 358 | to <var>s</var>.</p></li> |
annevk@4900 | 359 | |
annevk@4900 | 360 | <li><p>If a value is given append a "<code>:</code>" (U+003A), followed |
glenn@6934 | 361 | by a single SPACE (U+0020), followed by the |
annevk@4900 | 362 | <span title="serialize a media feature value">serialized media feature value</span>, |
glenn@6229 | 363 | to <var>s</var>.</p></li> |
annevk@4900 | 364 | |
annevk@4900 | 365 | <li><p>Append a "<code>)</code>" (U+0029) to |
glenn@6229 | 366 | <var>s</var>.</p></li> |
annevk@4900 | 367 | |
glenn@6934 | 368 | <li><p>If this is not the last media feature append a single SPACE (U+0020), |
glenn@6934 | 369 | followed by "<code>and</code>", followed by a single SPACE (U+0020), to |
glenn@6229 | 370 | <var>s</var>.</p></li> |
annevk@4900 | 371 | </ol> |
annevk@4900 | 372 | </li> |
annevk@4900 | 373 | </ol> |
annevk@4900 | 374 | |
annevk@4900 | 375 | <div class="example"> |
annevk@4900 | 376 | <p>Here are some examples of input (first column) and output (second |
annevk@4900 | 377 | column):</p> |
annevk@4900 | 378 | |
annevk@4900 | 379 | <table> |
annevk@4900 | 380 | <thead> |
annevk@4900 | 381 | <tr><th>Input<th>Output |
annevk@4900 | 382 | <tbody> |
annevk@4900 | 383 | <tr> |
glenn@7306 | 384 | <td><pre>not screen and (min-WIDTH:5px) AND (max-width:40px)</pre> |
glenn@7306 | 385 | <td><pre>not screen and (max-width: 40px) and (min-width: 5px)</pre> |
annevk@4900 | 386 | <tr> |
glenn@7306 | 387 | <td><pre>all and (color) and (color)</pre> |
glenn@7306 | 388 | <td><pre>(color)</pre> |
annevk@4900 | 389 | </table> |
annevk@4900 | 390 | </div> |
annevk@4900 | 391 | |
annevk@4900 | 392 | |
glenn@6229 | 393 | <!-- ........................................................................................................................ --> |
glenn@6229 | 394 | |
annevk@4900 | 395 | <h4>Serializing Media Feature Values</h4> |
annevk@4900 | 396 | |
glenn@6344 | 397 | <p class="issue">This should probably be done in terms of mapping it to |
annevk@4900 | 398 | serializing CSS values as media features are defined in terms of CSS |
annevk@4900 | 399 | values after all.</p> |
annevk@4900 | 400 | |
annevk@4900 | 401 | <p>To <dfn id="serialize-a-media-feature-value">serialize a media feature value</dfn> |
glenn@6229 | 402 | named <var>v</var> locate <var>v</var> in the first |
annevk@4900 | 403 | column of the table below and use the serialization format described in |
annevk@4900 | 404 | the second column:</p> |
annevk@4900 | 405 | |
annevk@4900 | 406 | <table> |
annevk@4900 | 407 | <tr> |
annevk@4900 | 408 | <th>Media Feature |
annevk@4900 | 409 | <th>Serialization |
annevk@4900 | 410 | <tr> |
glenn@6229 | 411 | <td><code>width</code> |
annevk@4900 | 412 | <td>... |
annevk@4900 | 413 | <tr> |
glenn@6229 | 414 | <td><code>height</code> |
annevk@4900 | 415 | <td>... |
annevk@4900 | 416 | <tr> |
glenn@6229 | 417 | <td><code>device-width</code> |
annevk@4900 | 418 | <td>... |
annevk@4900 | 419 | <tr> |
glenn@6229 | 420 | <td><code>device-height</code> |
annevk@4900 | 421 | <td>... |
annevk@4900 | 422 | <tr> |
glenn@6229 | 423 | <td><code>orientation</code> |
annevk@4900 | 424 | <td> |
glenn@6229 | 425 | <p>If the value is `<code>portrait</code>`: "<code>portrait</code>".</p> |
glenn@6229 | 426 | <p>If the value is `<code>landscape</code>`: "<code>landscape</code>".</p> |
annevk@4900 | 427 | <tr> |
glenn@6229 | 428 | <td><code>aspect-ratio</code> |
annevk@4900 | 429 | <td>... |
annevk@4900 | 430 | <tr> |
glenn@6229 | 431 | <td><code>device-aspect-ratio</code> |
annevk@4900 | 432 | <td>... |
annevk@4900 | 433 | <tr> |
glenn@6229 | 434 | <td><code>color</code> |
annevk@4900 | 435 | <td>... |
annevk@4900 | 436 | <tr> |
glenn@6229 | 437 | <td><code>color-index</code> |
annevk@4900 | 438 | <td>... |
annevk@4900 | 439 | <tr> |
glenn@6229 | 440 | <td><code>monochrome</code> |
annevk@4900 | 441 | <td>... |
annevk@4900 | 442 | <tr> |
glenn@6229 | 443 | <td><code>resolution</code> |
annevk@4900 | 444 | <td>... |
annevk@4900 | 445 | <tr> |
glenn@6229 | 446 | <td><code>scan</code> |
annevk@4900 | 447 | <td> |
glenn@6229 | 448 | <p>If the value is `<code>progressive</code>`: "<code>progressive</code>".</p> |
glenn@6229 | 449 | <p>If the value is `<code>interlace</code>`: "<code>interlace</code>".</p> |
annevk@4900 | 450 | <tr> |
glenn@6229 | 451 | <td><code>grid</code> |
annevk@4900 | 452 | <td>... |
annevk@4900 | 453 | </table> |
annevk@4900 | 454 | |
annevk@4900 | 455 | <p>Other specifications can extend this table and vendor-prefixed media |
annevk@4900 | 456 | features can have custom serialization formats as well.</p> |
annevk@4900 | 457 | |
glenn@6229 | 458 | <!-- ........................................................................................................................ --> |
glenn@6229 | 459 | <!-- ........................................................................................................................ --> |
annevk@4900 | 460 | |
annevk@4900 | 461 | <h3>Comparing Media Queries</h3> |
annevk@4900 | 462 | |
annevk@4900 | 463 | <p>To |
annevk@4900 | 464 | <dfn id="compare-media-queries">compare media queries</dfn> |
glenn@6229 | 465 | <var>m1</var> and <var>m2</var> means to |
annevk@4900 | 466 | <span title="serialize a media query">serialize</span> them both and |
annevk@4900 | 467 | return true if they are a |
annevk@4914 | 468 | <span data-anolis-spec=dom>case-sensitive</span> match and false if they |
annevk@4900 | 469 | are not.</p> |
annevk@4900 | 470 | |
glenn@6229 | 471 | <!-- ........................................................................................................................ --> |
glenn@6229 | 472 | <!-- ........................................................................................................................ --> |
glenn@6229 | 473 | |
glenn@6229 | 474 | <h3>The <code>MediaList</code> Interface</h3> |
glenn@6229 | 475 | |
glenn@6229 | 476 | <!--{@idl(MediaList)}--> |
glenn@6229 | 477 | |
glenn@6229 | 478 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 479 | |
annevk@4900 | 480 | <h2>Selectors</h2> |
annevk@4900 | 481 | |
annevk@4900 | 482 | <p>Selectors are defined in the Selectors specification. This section |
annevk@4900 | 483 | mainly defines how to serialize them.</p> <!-- XXX ref --> |
annevk@4900 | 484 | |
annevk@4900 | 485 | <!-- XXX ref universal selector etc? some are in <span> some not --> |
annevk@4900 | 486 | |
glenn@6229 | 487 | <!-- ........................................................................................................................ --> |
glenn@6229 | 488 | <!-- ........................................................................................................................ --> |
glenn@6229 | 489 | |
annevk@4900 | 490 | <h3>Parsing Selectors</h3> |
annevk@4900 | 491 | |
annevk@4900 | 492 | <p>To |
annevk@4900 | 493 | <dfn id="parse-a-group-of-selectors">parse a group of selectors</dfn> |
glenn@6229 | 494 | means to parse the value using the <code>selectors_group</code> |
annevk@4900 | 495 | production defined in the Selectors specification and return either a |
glenn@6933 | 496 | group of selectors if parsing did not fail or <code>null</code> if parsing did |
annevk@4900 | 497 | fail.</p> <!-- XXX ref --> |
annevk@4900 | 498 | |
glenn@6229 | 499 | <!-- ........................................................................................................................ --> |
glenn@6229 | 500 | <!-- ........................................................................................................................ --> |
annevk@4900 | 501 | |
annevk@4900 | 502 | <h3>Serializing Selectors</h3> |
annevk@4900 | 503 | <!-- http://dump.testsuite.org/2009/cssom/serializing-selectors.htm --> |
annevk@4900 | 504 | |
annevk@4900 | 505 | <p>To |
annevk@4900 | 506 | <dfn id="serialize-a-group-of-selectors">serialize a group of selectors</dfn> |
annevk@4900 | 507 | <span title="serialize a selector">serialize</span> each selector in the |
annevk@4900 | 508 | group of selectors and then |
annevk@4900 | 509 | <span title="serialize a comma-separated list">serialize</span> the |
annevk@4900 | 510 | group.</p> |
annevk@4900 | 511 | |
annevk@4900 | 512 | <p>To <dfn id="serialize-a-selector">serialize a selector</dfn> let |
glenn@6229 | 513 | <var>s</var> be the empty string, run the steps below for each |
annevk@4900 | 514 | part of the chain of the selector, and finally return |
glenn@6229 | 515 | <var>s</var>:</p> |
annevk@4900 | 516 | |
annevk@4900 | 517 | <ol> |
annevk@4900 | 518 | <li><p>If there is only one <span>simple selector</span> in the |
annevk@4900 | 519 | <span>sequence of simple selectors</span> which is a |
annevk@4900 | 520 | <span>universal selector</span>, append the result of |
annevk@4900 | 521 | <span title="serialize a simple selector">serializing</span> the |
glenn@6229 | 522 | <span>universal selector</span> to <var>s</var>.</p></li> |
annevk@4900 | 523 | |
annevk@4900 | 524 | <li><p>Otherwise, for each <span>simple selector</span> in the |
annevk@4900 | 525 | <span>sequence of simple selectors</span> that is not a |
annevk@4900 | 526 | universal selector of which the <span>namespace prefix</span> maps to |
annevk@4900 | 527 | the null namespace (not in a namespace) or of which the |
annevk@4900 | 528 | <span>namespace prefix</span> maps to a namespace that is not the |
annevk@4900 | 529 | <span>default namespace</span> |
annevk@4900 | 530 | <span title="serialize a simple selector">serialize</span> the |
annevk@4900 | 531 | <span>simple selector</span> and append the result to |
glenn@6229 | 532 | <var>s</var>.</p></li> |
annevk@4900 | 533 | |
annevk@4900 | 534 | <li><p>If this is not the last part of the chain of the selector append a |
glenn@6934 | 535 | single SPACE (U+0020), followed by the combinator |
annevk@4900 | 536 | "<code>></code>", |
annevk@4900 | 537 | "<code>+</code>", or |
annevk@4900 | 538 | "<code>~</code>" |
glenn@6934 | 539 | as appropriate, followed by another single SPACE (U+0020) if the combinator was |
glenn@6229 | 540 | not whitespace, to <var>s</var>.</p></li> |
annevk@4900 | 541 | |
annevk@4900 | 542 | <li><p>If this is the last part of the chain of the selector and there is |
annevk@4900 | 543 | a pseudo-element, append "<code>::</code>" followed by the name of the |
glenn@6229 | 544 | pseudo-class, to <var>s</var>.</p></li> |
annevk@4900 | 545 | </ol> |
annevk@4900 | 546 | |
annevk@4900 | 547 | |
annevk@4900 | 548 | <p>To |
annevk@4900 | 549 | <dfn id="serialize-a-simple-selector">serialize a simple selector</dfn> |
glenn@6229 | 550 | let <var>s</var> be the empty string, run the steps below, and |
glenn@6229 | 551 | finally return <var>s</var>:</p> |
annevk@4900 | 552 | |
annevk@4900 | 553 | <dl class="switch"> |
annevk@4900 | 554 | <dt>type selector</dt> |
annevk@4900 | 555 | <dt>universal selector</dt> |
annevk@4900 | 556 | <dd> |
annevk@4900 | 557 | <ol> |
annevk@4900 | 558 | <li><p>If the <span>namespace prefix</span> maps to a namespace that is |
annevk@4900 | 559 | not the <span>default namespace</span> and is not the |
annevk@4900 | 560 | null namespace (not in a namespace) append the |
annevk@4900 | 561 | <span title="serialize an identifier">escaped</span> |
annevk@4900 | 562 | <span>namespace prefix</span>, followed by a "<code>|</code>" (U+007C) |
glenn@6229 | 563 | to <var>s</var>.</p></li> |
annevk@4900 | 564 | |
annevk@4900 | 565 | <li><p>If the <span>namespace prefix</span> maps to a namespace that is |
annevk@4900 | 566 | the null namespace (not in a namespace) append |
glenn@6229 | 567 | "<code>|</code>" (U+007C) to <var>s</var>.</p></li> |
annevk@4900 | 568 | <!-- This includes |* --> |
annevk@4900 | 569 | |
annevk@4900 | 570 | <li><p>If this is a type selector append the |
annevk@4900 | 571 | <span title="serialize an identifier">escaped</span> element name to |
glenn@6229 | 572 | <var>s</var>.</p></li> |
annevk@4900 | 573 | |
glenn@4922 | 574 | <li><p>If this is a universal selector append "<code>*</code>" (U+002A) |
glenn@6229 | 575 | to <var>s</var>.</p></li> |
annevk@4900 | 576 | </ol> |
annevk@4900 | 577 | </dd> |
annevk@4900 | 578 | |
annevk@4900 | 579 | <dt>attribute selector</dt> |
annevk@4900 | 580 | <dd> |
annevk@4900 | 581 | <ol> |
annevk@4900 | 582 | <li><p>Append "<code>[</code>" (U+005B) to |
glenn@6229 | 583 | <var>s</var>.</p></li> |
annevk@4900 | 584 | |
annevk@4900 | 585 | <li><p>If the <span>namespace prefix</span> maps to a namespace that is |
annevk@4900 | 586 | not the null namespace (not in a namespace) append the |
annevk@4900 | 587 | <span title="serialize an identifier">escaped</span> |
annevk@4900 | 588 | <span>namespace prefix</span>, followed by a "<code>|</code>" (U+007C) |
glenn@6229 | 589 | to <var>s</var>.</p></li> |
annevk@4900 | 590 | |
annevk@4900 | 591 | <li><p>If the <span>namespace prefix</span> maps to a namespace that is |
annevk@4900 | 592 | the null namespace (not in a namespace) append |
glenn@6229 | 593 | "<code>|</code>" (U+007C) to <var>s</var>.</p></li> |
annevk@4900 | 594 | <!-- This includes |* --> |
annevk@4900 | 595 | |
annevk@4900 | 596 | <li><p>Append the <span title="serialize an identifier">escaped</span> |
glenn@6229 | 597 | attribute name to <var>s</var>.</p></li> |
annevk@4900 | 598 | |
annevk@4900 | 599 | <li><p>If there is an attribute value specified, append |
annevk@4900 | 600 | "<code>=</code>", |
annevk@4900 | 601 | "<code>~=</code>", |
annevk@4900 | 602 | "<code>|=</code>", |
annevk@4900 | 603 | "<code>^=</code>", |
annevk@4900 | 604 | "<code>$=</code>", or |
annevk@4900 | 605 | "<code>*=</code>" |
annevk@4900 | 606 | as appropriate (depending on the type of attribute selector), followed |
annevk@4900 | 607 | by the <span title="serialize a string">string escaped</span> |
glenn@6229 | 608 | attribute value, to <var>s</var>.</p></li> |
annevk@4900 | 609 | |
annevk@4900 | 610 | <li><p>Append "<code>]</code>" (U+005D) to |
glenn@6229 | 611 | <var>s</vaR>.</p></li> |
annevk@4900 | 612 | </ol> |
annevk@4900 | 613 | </dd> |
annevk@4900 | 614 | |
annevk@4900 | 615 | <dt>class selector</dt> |
annevk@4900 | 616 | <dd><p>Append a "<code>.</code>" (U+002E), followed by the |
annevk@4900 | 617 | <span title="serialize an identifier">escaped</span> class name to |
glenn@6229 | 618 | <var>s</var>.</p></dd> |
annevk@4900 | 619 | |
annevk@4900 | 620 | <dt>ID selector</dt> |
annevk@4900 | 621 | <dd><p>Append a "<code>#</code>" (U+0023), followed by the |
annevk@4900 | 622 | <span title="serialize an identifier">escaped</span> ID to |
glenn@6229 | 623 | <var>s</var>.</p></dd> |
annevk@4900 | 624 | |
annevk@4900 | 625 | <dt>pseudo-class</dt> |
annevk@4900 | 626 | <dd> |
annevk@4900 | 627 | <p>If the pseudo-class does not accept arguments append |
annevk@4900 | 628 | "<code>:</code>" (U+003A), followed by the name of the pseudo-class, to |
glenn@6229 | 629 | <var>s</var>.</p> |
annevk@4900 | 630 | |
annevk@4900 | 631 | <p>Otherwise, append "<code>:</code>" (U+003A), followed by the name of |
annevk@4900 | 632 | the pseudo-class, followed by "<code>(</code>" (U+0028), followed by the |
annevk@4900 | 633 | value of the pseudo-class argument determined as per below, followed by |
glenn@6229 | 634 | "<code>)</code>" (U+0029), to <var>s</var>.</p> |
annevk@4900 | 635 | |
annevk@4900 | 636 | <dl class="switch"> |
glenn@6229 | 637 | <dt><code>:lang()</code></dt> |
annevk@4900 | 638 | <dd><p>The <span title="serialize an identifier">escaped</span> |
annevk@4900 | 639 | value.</p></dd> |
annevk@4900 | 640 | |
glenn@6229 | 641 | <dt><code>:nth-child()</code></dt> |
glenn@6229 | 642 | <dt><code>:nth-last-child()</code></dt> |
glenn@6229 | 643 | <dt><code>:nth-of-type()</code></dt> |
glenn@6229 | 644 | <dt><code>:nth-last-of-type()</code></dt> |
annevk@4900 | 645 | <dd> |
annevk@4900 | 646 | <ol> |
annevk@4900 | 647 | <li><p>If the value is odd let the value be |
glenn@6229 | 648 | "<code>2n+1</code>".</p></li> |
annevk@4900 | 649 | |
annevk@4900 | 650 | <li><p>If the value is even let the value be |
glenn@6229 | 651 | "<code>2n</code>".</p></li> |
glenn@6229 | 652 | |
glenn@6229 | 653 | <li><p>If <var>a</var> is zero let the value be |
glenn@6229 | 654 | <var>b</var> |
annevk@4900 | 655 | <span title="serialize a CSS component value">serialized</span> as <integer>.</p></li> |
annevk@4900 | 656 | |
glenn@6229 | 657 | <li><p>If <var>a</var> is one or minus one and |
glenn@6229 | 658 | <var>b</var> is zero let the value be |
glenn@6229 | 659 | "<code>n</code>" (U+006E).</p></li> |
glenn@6229 | 660 | |
glenn@6229 | 661 | <li><p>If <var>a</var> is one or minus one let the value be |
glenn@6229 | 662 | "<code>n</code>" (U+006E), followed by |
glenn@6229 | 663 | "<code>+</code>" (U+002B) if <var>b</var> is positive, |
glenn@6229 | 664 | followed by <var>b</var> |
annevk@4900 | 665 | <span title="serialize a CSS component value">serialized</span> as <integer>.</p></li> |
annevk@4900 | 666 | |
glenn@6229 | 667 | <li><p>If <var>b</var> is zero let the value be |
glenn@6229 | 668 | <var>a</var> |
annevk@4900 | 669 | <span title="serialize a CSS component value">serialized</span> as <integer>, |
glenn@6229 | 670 | followed by "<code>n</code>" (U+006E).</p></li> |
annevk@4900 | 671 | |
annevk@4900 | 672 | <li><p>Otherwise let the value be |
glenn@6229 | 673 | <var>a</var> |
annevk@4900 | 674 | <span title="serialize a CSS component value">serialized</span> as <integer>, |
glenn@6229 | 675 | followed by "<code>n</code>" (U+006E), followed by |
glenn@6229 | 676 | "<code>+</code>" (U+002B) if <var>b</var> is positive, |
glenn@6229 | 677 | followed by <var>b</var> |
annevk@4900 | 678 | <span title="serialize a CSS component value">serialized</span> as <integer>.</p></li> |
annevk@4900 | 679 | </ol> |
annevk@4900 | 680 | </dd> |
annevk@4900 | 681 | |
glenn@6229 | 682 | <dt><code>:not()</code></dt> |
annevk@4900 | 683 | <dd><p>The result of serializing the value using the rules for |
annevk@4900 | 684 | <span title="serialize a group of selectors">serializing a group of selectors</span>.</p></dd> |
annevk@4900 | 685 | </dl> |
annevk@4900 | 686 | </dd> |
annevk@4900 | 687 | </dl> |
annevk@4900 | 688 | |
glenn@6229 | 689 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 690 | |
annevk@4900 | 691 | <h2>CSS</h2> |
annevk@4900 | 692 | |
glenn@6229 | 693 | <!-- ........................................................................................................................ --> |
glenn@6229 | 694 | <!-- ........................................................................................................................ --> |
glenn@6229 | 695 | |
glenn@6794 | 696 | <h3>CSS Style Sheets</h3> |
annevk@4900 | 697 | |
annevk@4900 | 698 | <!-- XXX |
annevk@4900 | 699 | element inserted into the DOM, style sheet created, element removed from |
annevk@4900 | 700 | the DOM, what happens to StyleSheet? |
annevk@4900 | 701 | --> |
annevk@4900 | 702 | |
glenn@6794 | 703 | <p>A <dfn id="css-style-sheet">CSS style sheet</dfn> is an abstract concept that |
glenn@6794 | 704 | represents a style sheet as defined by the CSS specification. In the CSSOM a |
glenn@6794 | 705 | <span>CSS style sheet</span> is represented as a <code>CSSStyleSheet</code> object. A |
glenn@6794 | 706 | <span>CSS style sheet</span> has a number of associated state items:</p> |
annevk@4900 | 707 | |
annevk@4900 | 708 | <dl> |
annevk@4900 | 709 | <dt><dfn id="style-sheet-type">style sheet type</dfn></dt> |
annevk@4900 | 710 | <dd><p>The literal string "<code>text/css</code>".</p></dd> |
annevk@4900 | 711 | |
annevk@4900 | 712 | <dt><dfn id="style-sheet-location">style sheet location</dfn></dt> |
annevk@4900 | 713 | <dd><p>The <span data-anolis-spec=html>URL</span> of the |
glenn@6933 | 714 | <span>style sheet</span> or <code>null</code> if the <span>style sheet</span> was |
annevk@4900 | 715 | embedded.</p></dd> |
annevk@4900 | 716 | |
annevk@4900 | 717 | <dt><dfn id="style-sheet-parent">style sheet parent</dfn></dt> |
annevk@4900 | 718 | <dd><p>The <span>style sheet</span> that is the parent of the |
glenn@6933 | 719 | <span>style sheet</span> or <code>null</code> if there is no associated parent.</p></dd> |
annevk@4900 | 720 | |
annevk@4900 | 721 | <dt><dfn id="style-sheet-owner-node">style sheet owner node</dfn></dt> |
annevk@4900 | 722 | <dd><p>The DOM node associated with the <span>style sheet</span> or |
glenn@6933 | 723 | <code>null</code> if there is no associated DOM node.</p></dd> |
annevk@4900 | 724 | |
annevk@4900 | 725 | <dt><dfn id="style-sheet-owner-css-rule">style sheet owner CSS rule</dfn></dt> |
annevk@4900 | 726 | <dd><p>The <span>CSS rule</span> in the <span>style sheet parent</span> |
glenn@6933 | 727 | that caused the inclusion of the <span>style sheet</span> or <code>null</code> if |
glenn@6933 | 728 | there is no associated rule.</p></dd> |
annevk@4900 | 729 | |
annevk@4900 | 730 | <dt><dfn id="style-sheet-media">style sheet media</dfn></dt> |
annevk@4900 | 731 | <dd> |
annevk@4900 | 732 | <p>The <code>MediaList</code> object associated with the |
annevk@4900 | 733 | <span>style sheet</span>.</p> |
annevk@4900 | 734 | |
annevk@4900 | 735 | <p>If this property is set to a string run the |
annevk@4900 | 736 | <span>create a <code>MediaList</code> object</span> steps for that |
annevk@4900 | 737 | string and associate the returned object with the |
annevk@4900 | 738 | <span>style sheet</span>.</p> |
annevk@4900 | 739 | </dd> |
annevk@4900 | 740 | |
annevk@4900 | 741 | <dt><dfn id="style-sheet-title">style sheet title</dfn></dt> |
annevk@4900 | 742 | <dd> |
glenn@6933 | 743 | <p>The title of the <span>style sheet</span> or <code>null</code> if no title |
glenn@6933 | 744 | is specified or is the empty string, in which case the title is referred to |
glenn@6933 | 745 | as an empty title.</p> |
annevk@4900 | 746 | |
annevk@4900 | 747 | <div class="example"> |
glenn@6933 | 748 | <p>In the following, the <span>style sheet title</span> is non-empty |
glenn@6933 | 749 | for the first style sheet, but is empty for the second and third style sheets.</p> |
glenn@7306 | 750 | <pre><style title="papaya whip"> |
glenn@7306 | 751 | body { background: #ffefd5; } |
glenn@6933 | 752 | </style></pre> |
glenn@6933 | 753 | <pre><style title=""> |
glenn@6942 | 754 | body { background: orange; } |
glenn@6933 | 755 | </style></pre> |
glenn@6933 | 756 | <pre><style> |
glenn@6942 | 757 | body { background: brown; } |
glenn@6933 | 758 | </style></pre> |
annevk@4900 | 759 | </div> |
annevk@4900 | 760 | </dd> |
annevk@4900 | 761 | |
annevk@4900 | 762 | <dt><dfn id="style-sheet-alternate-flag">style sheet alternate flag</dfn></dt> |
annevk@4900 | 763 | <dd> |
glenn@6933 | 764 | <p>Either set or clear. Clear by default.</p> |
annevk@4900 | 765 | |
annevk@4900 | 766 | <div class="example"> |
annevk@4900 | 767 | <p>The following <span title="style sheet">style sheets</span> have |
annevk@4900 | 768 | their <span>style sheet alternate flag</span> set:</p> |
annevk@4900 | 769 | |
glenn@7306 | 770 | <pre><?xml-stylesheet alternate="yes" title="x" href="data:text/css,…"?></pre> |
annevk@4900 | 771 | |
glenn@7306 | 772 | <pre><link rel="alternate stylesheet" title="x" href="data:text/css,…"></pre> |
annevk@4900 | 773 | </div> |
annevk@4900 | 774 | </dd> |
annevk@4900 | 775 | |
annevk@4900 | 776 | <dt><dfn id="style-sheet-disabled-flag">style sheet disabled flag</dfn></dt> |
annevk@4900 | 777 | <dd> |
glenn@6933 | 778 | <p>Either set or clear. Clear by default.</p> |
annevk@4917 | 779 | |
glenn@6933 | 780 | <p class="note">Even when clear it does not necessarily mean that the |
annevk@4917 | 781 | <span>style sheet</span> is actually used for rendering.</p> |
annevk@4900 | 782 | </dd> |
annevk@4900 | 783 | |
annevk@4900 | 784 | |
annevk@4900 | 785 | <dt><dfn id="style-sheet-css-rules">style sheet CSS rules</dfn></dt> |
annevk@4900 | 786 | <dd><p>The <span title="CSS rule">CSS rules</span> associated with the |
annevk@4900 | 787 | <span>style sheet</span>.</p></dd> |
annevk@4900 | 788 | </dl> |
annevk@4900 | 789 | |
annevk@4900 | 790 | <p>When you are to <span>create a style sheet</span> the above properties, |
annevk@4900 | 791 | with the exception of <span>style sheet type</span> and |
annevk@4900 | 792 | <span>style sheet CSS rules</span>, are to be set to |
annevk@4900 | 793 | their proper values.</p> |
annevk@4900 | 794 | |
annevk@4900 | 795 | <!-- same-origin restrictions --> |
annevk@4900 | 796 | |
glenn@6229 | 797 | <!-- ........................................................................................................................ --> |
glenn@6229 | 798 | |
glenn@6229 | 799 | <h4>The <code>StyleSheet</code> Interface</h4> |
glenn@6229 | 800 | |
glenn@6229 | 801 | <!--{@idl(StyleSheet)}--> |
glenn@6229 | 802 | |
glenn@6229 | 803 | <!-- ........................................................................................................................ --> |
glenn@6229 | 804 | |
glenn@6229 | 805 | <h4>The <code>CSSStyleSheet</code> Interface</h4> |
glenn@6229 | 806 | |
glenn@6229 | 807 | <!--{@idl(CSSStyleSheet)}--> |
glenn@6229 | 808 | |
glenn@6229 | 809 | <!-- ........................................................................................................................ --> |
glenn@6229 | 810 | <!-- ........................................................................................................................ --> |
annevk@4900 | 811 | |
annevk@4900 | 812 | <h3>Style Sheet Collections</h3> |
annevk@4900 | 813 | |
annevk@4900 | 814 | <p>Below various new concepts are defined that are associated with each |
annevk@4914 | 815 | <code data-anolis-spec=dom>Document</code> object.</p> |
annevk@4914 | 816 | |
annevk@4914 | 817 | <p>Each <code data-anolis-spec=dom>Document</code> has an associated list of zero or more |
annevk@4900 | 818 | <span title="style sheet">style sheets</span>, named the |
annevk@4900 | 819 | <dfn id="document-style-sheets">document style sheets</dfn>. This is |
annevk@4900 | 820 | an ordered list that contains all |
annevk@4900 | 821 | <span title="style sheet">style sheets</span> associated with the |
annevk@4914 | 822 | <code data-anolis-spec=dom>Document</code>, in |
annevk@4914 | 823 | <span data-anolis-spec=dom title=concept-tree-order>tree order</span>, with |
annevk@4900 | 824 | <span title="style sheet">style sheets</span> created from HTTP |
annevk@4900 | 825 | <code title="http-link">Link</code> headers first, if any, in header |
annevk@4900 | 826 | order.</p> |
annevk@4900 | 827 | |
annevk@4900 | 828 | <p>To <dfn id="create-a-style-sheet">create a style sheet</dfn>, run these |
annevk@4900 | 829 | steps:</p> |
annevk@4900 | 830 | |
annevk@4900 | 831 | <ol> |
annevk@4900 | 832 | <li><p>Create a new <span>style sheet</span> object and set its |
annevk@4900 | 833 | properties as specified.</p></li> |
annevk@4900 | 834 | |
annevk@4900 | 835 | <li><p>Then run the <span>add a style sheet</span> steps for the newly |
annevk@4900 | 836 | created <span>style sheet</span>.</p></li> |
annevk@4900 | 837 | </ol> |
annevk@4900 | 838 | |
annevk@4900 | 839 | <p>To <dfn id="add-a-style-sheet">add a style sheet</dfn>, run these |
annevk@4900 | 840 | steps:</p> |
annevk@4900 | 841 | |
annevk@4900 | 842 | <ol> |
annevk@4900 | 843 | <li><p>Add the <span>style sheet</span> to the list of |
annevk@4900 | 844 | <span>document style sheets</span> at the appropriate location. The |
annevk@4900 | 845 | remainder of these steps deal with the |
annevk@4900 | 846 | <span>style sheet disabled flag</span>.</p></li> |
annevk@4900 | 847 | |
annevk@4917 | 848 | <li><p>If the <span>style sheet disabled flag</span> is set, terminate |
annevk@4900 | 849 | these steps.</p></li> |
annevk@4900 | 850 | |
annevk@4900 | 851 | <li><p>If the <span>style sheet title</span> is non-empty, the |
glenn@6933 | 852 | <span>style sheet alternate flag</span> is clear, and |
annevk@4900 | 853 | <span>preferred style sheet set name</span> is the empty string |
annevk@4900 | 854 | <span>change the preferred style sheet set name</span> to the |
annevk@4900 | 855 | <span>style sheet title</span>.</p></li> |
annevk@4900 | 856 | |
annevk@4900 | 857 | <li> |
glenn@6933 | 858 | <p>If any of the following is true clear the |
annevk@4917 | 859 | <span>style sheet disabled flag</span> and terminate these steps: |
annevk@4900 | 860 | |
annevk@4900 | 861 | <ul> |
annevk@4900 | 862 | <li><p>The <span>style sheet title</span> is empty.</p></li> |
glenn@6933 | 863 | <li><p>The <span>last style sheet set name</span> is <code>null</code> and the |
annevk@4900 | 864 | <span>style sheet title</span> is a |
annevk@4914 | 865 | <span data-anolis-spec=dom>case-sensitive</span> match |
annevk@4900 | 866 | for the <span>preferred style sheet set name</span>.</p></li> |
annevk@4900 | 867 | <li><p>The <span>style sheet title</span> is a |
annevk@4914 | 868 | <span data-anolis-spec=dom>case-sensitive</span> match for the |
annevk@4900 | 869 | <span>last style sheet set name</span>.</p></li> |
annevk@4900 | 870 | </ul> |
annevk@4900 | 871 | </li> |
annevk@4900 | 872 | |
glenn@6229 | 873 | <li><p>Set the <span>style sheet disabled flag</span>.</li> |
annevk@4900 | 874 | </ol> |
annevk@4900 | 875 | |
annevk@4900 | 876 | <p>A <dfn id="persistent-style-sheet">persistent style sheet</dfn> is a |
annevk@4900 | 877 | <span>style sheet</span> from the <span>document style sheets</span> |
annevk@4900 | 878 | whose <span>style sheet title</span> is the empty string and whose |
glenn@6933 | 879 | <span>style sheet alternate flag</span> is clear.</p> |
annevk@4900 | 880 | |
annevk@4900 | 881 | <p>A <dfn id="style-sheet-set">style sheet set</dfn> is an ordered |
annevk@4900 | 882 | collection of one or more <span title="style sheet">style sheets</span> |
annevk@4900 | 883 | from the <span>document style sheets</span> which have an identical |
annevk@4900 | 884 | <span>style sheet title</span> that is not the empty string.</p> |
annevk@4900 | 885 | |
annevk@4900 | 886 | <p>A <dfn id="style-sheet-set-name">style sheet set name</dfn> is the |
annevk@4900 | 887 | <span>style sheet title</span> the <span>style sheet set</span> has in |
annevk@4900 | 888 | common.</p> |
annevk@4900 | 889 | |
annevk@4900 | 890 | <p>An <dfn id="enabled-style-sheet-set">enabled style sheet set</dfn> is a |
annevk@4900 | 891 | <span>style sheet set</span> of which each <span>style sheet</span> has |
glenn@6933 | 892 | its <span>style sheet disabled flag</span> clear.</p> |
annevk@4900 | 893 | |
annevk@4900 | 894 | <p>To <dfn id="enable-a-style-sheet-set">enable a style sheet set</dfn> |
glenn@6229 | 895 | with name <var>name</var>, run these steps:</p> |
annevk@4900 | 896 | |
annevk@4900 | 897 | <ol> |
glenn@6229 | 898 | <li><p>If <var>name</var> is the empty string, set the |
annevk@4900 | 899 | <span>style sheet disabled flag</span> for each <span>style sheet</span> |
glenn@6229 | 900 | that is in a <span>style sheet set</span> and terminate these steps.</li> |
annevk@4917 | 901 | |
glenn@6933 | 902 | <li><p>Clear the <span>style sheet disabled flag</span> for each |
annevk@4900 | 903 | <span>style sheet</span> in a <span>style sheet set</span> whose |
annevk@4900 | 904 | <span>style sheet set name</span> is a |
annevk@4914 | 905 | <span data-anolis-spec=dom>case-sensitive</span> match for |
glenn@6229 | 906 | <var>name</var> and set it for all other |
annevk@4900 | 907 | <span title="style sheet">style sheets</span> in a |
annevk@4900 | 908 | <span>style sheet set</span>.</p></li> |
annevk@4900 | 909 | </ol> |
annevk@4900 | 910 | |
annevk@4900 | 911 | <p>To <dfn id="select-a-style-sheet-set">select a style sheet set</dfn> |
glenn@6229 | 912 | with name <var>name</var>, run these steps:</p> |
annevk@4900 | 913 | |
annevk@4900 | 914 | <ol> |
annevk@4900 | 915 | <li><p><span>Enable a style sheet set</span> with name |
glenn@6229 | 916 | <var>name</var>.</p></li> |
annevk@4900 | 917 | |
annevk@4900 | 918 | <li><p>Set <span>last style sheet set name</span> to |
glenn@6229 | 919 | <var>name</var>.</p></li> |
annevk@4900 | 920 | </ol> |
annevk@4900 | 921 | |
annevk@4900 | 922 | <p>A <dfn id="last-style-sheet-set-name">last style sheet set name</dfn> |
annevk@4900 | 923 | is a concept to determine what <span>style sheet set</span> was last |
annevk@4900 | 924 | <span title="select a style sheet set">selected</span>. Initially its |
glenn@6933 | 925 | value is <code>null</code>.</p> |
annevk@4900 | 926 | |
annevk@4900 | 927 | <p>A |
annevk@4900 | 928 | <dfn id="preferred-style-sheet-set-name">preferred style sheet set name</dfn> |
annevk@4900 | 929 | is a concept to determine which |
glenn@6229 | 930 | <span title="style sheet">style sheets</span> need to have their |
glenn@6933 | 931 | <span>style sheet disabled flag</span> clear. Initially its value |
annevk@4900 | 932 | is the empty string. |
annevk@4900 | 933 | |
annevk@4900 | 934 | <p>To |
annevk@4900 | 935 | <dfn id="change-the-preferred-style-sheet-set-name">change the preferred style sheet set name</dfn> |
glenn@6229 | 936 | with name <var>name</var>, run these steps:</p> |
annevk@4900 | 937 | |
annevk@4900 | 938 | <ol> |
glenn@6427 | 939 | <li><p>Let <var>current</var> be the <span>preferred style sheet set name</span>.</p></li> |
annevk@4900 | 940 | |
annevk@4900 | 941 | <li><p>Set <span>preferred style sheet set name</span> to |
glenn@6229 | 942 | <var>name</var>.</p></li> |
glenn@6229 | 943 | |
glenn@6229 | 944 | <li><p>If <var>name</var> is not a |
annevk@4914 | 945 | <span data-anolis-spec=dom>case-sensitive</span> match for |
glenn@6229 | 946 | <var>current</var> and |
glenn@6933 | 947 | <span>last style sheet set name</span> is <code>null</code> |
annevk@4900 | 948 | <span>enable a style sheet set</span> with name |
glenn@6427 | 949 | <var>name</var>.</p></li> |
annevk@4900 | 950 | </ol> |
annevk@4900 | 951 | |
annevk@4900 | 952 | <!-- XXX ought to define "applied" |
annevk@4900 | 953 | |
annevk@4900 | 954 | thoughts: |
annevk@4900 | 955 | depends on disabled flag, alternate flag, media queries, sheesh |
annevk@4900 | 956 | --> |
annevk@4900 | 957 | |
glenn@6229 | 958 | <!-- ........................................................................................................................ --> |
glenn@6229 | 959 | |
glenn@6229 | 960 | <h4>The HTTP <code>Default-Style</code> Header</h4> |
annevk@4900 | 961 | |
annevk@4900 | 962 | <p>The HTTP <code title="http-default-style">Default-Style</code> header |
annevk@4900 | 963 | can be used to set the <span>preferred style sheet set name</span> |
annevk@4900 | 964 | influencing which <span>style sheet set</span> is (initially) the |
annevk@4900 | 965 | <span>enabled style sheet set</span>.</p> |
annevk@4900 | 966 | |
annevk@4900 | 967 | <p>For each HTTP <code title="http-default-style">Default-Style</code> |
annevk@4900 | 968 | header, in header order, the user agent must |
annevk@4900 | 969 | <span>change the preferred style sheet set name</span> with name being the |
annevk@4900 | 970 | value of the header.</p> |
annevk@4900 | 971 | |
glenn@6229 | 972 | <!-- ........................................................................................................................ --> |
glenn@6229 | 973 | |
glenn@6229 | 974 | <h4>The <code>StyleSheetList</code> Sequence</h4> |
glenn@6229 | 975 | |
glenn@6229 | 976 | <!--{@idl(StyleSheetList)}--> |
glenn@6229 | 977 | |
glenn@6229 | 978 | <!-- ........................................................................................................................ --> |
glenn@6229 | 979 | |
glenn@6229 | 980 | <h4>Extensions to the <code>Document</code> Interface</h4> |
glenn@6229 | 981 | |
glenn@6229 | 982 | <!--{@idl(Document)}--> |
glenn@6229 | 983 | |
glenn@6229 | 984 | <!-- ........................................................................................................................ --> |
annevk@4900 | 985 | |
annevk@4900 | 986 | <h4>Interaction with the User Interface</h4> |
annevk@4900 | 987 | |
annevk@4900 | 988 | <p>The user interface of Web browsers that support style sheets |
annevk@4900 | 989 | should list the style sheet titles given in the |
annevk@4900 | 990 | <code title="dom-Document-styleSheetSets">styleSheetSets</code> list, |
annevk@4900 | 991 | showing the |
annevk@4900 | 992 | <code title="dom-Document-selectedStyleSheetSet">selectedStyleSheetSet</code> |
annevk@4900 | 993 | as the selected style sheet set, leaving none selected if it is |
glenn@6933 | 994 | <code>null</code> or the empty string, and selecting an extra option |
annevk@4900 | 995 | "Basic Page Style" (or similar) if it is the empty string and the |
annevk@4900 | 996 | <code title="dom-Document-preferredStyleSheetSet">preferredStyleSheetSet</code> |
annevk@4900 | 997 | is the empty string as well.</p> |
annevk@4900 | 998 | |
annevk@4900 | 999 | <p>Selecting a style sheet from this list should |
annevk@4900 | 1000 | use the <span>select a style sheet set</span> set of steps. This |
annevk@4900 | 1001 | (by definition) affects the |
annevk@4900 | 1002 | <code title="dom-Document-lastStyleSheetSet">lastStyleSheetSet</code> |
annevk@4900 | 1003 | attribute.</p> |
annevk@4900 | 1004 | |
annevk@4900 | 1005 | <h5>Persisting the selected style sheet set</h5> |
annevk@4900 | 1006 | |
annevk@4900 | 1007 | <p>If a user agent persist the selected style sheet set, they should use |
annevk@4900 | 1008 | the value of the |
annevk@4900 | 1009 | <code title="dom-Document-selectedStyleSheetSet">selectedStyleSheetSet</code> |
glenn@6933 | 1010 | attribute, or if that is <code>null</code>, the |
annevk@4900 | 1011 | <code title="dom-Document-lastStyleSheetSet">lastStyleSheetSet</code> |
annevk@4900 | 1012 | attribute, when leaving the page (or at some other time) to determine the |
glenn@6933 | 1013 | set name to store. If that is <code>null</code> then the style sheet set should not be |
annevk@4900 | 1014 | persisted.</p> |
annevk@4900 | 1015 | |
annevk@4900 | 1016 | <p>When re-setting the style sheet set to the persisted value (which can |
annevk@4900 | 1017 | happen at any time, typically at the first time the style sheets are |
annevk@4900 | 1018 | needed for styling the document, after the <code><head></code> of |
annevk@4900 | 1019 | the document has been parsed, after any scripts that are not dependent on |
annevk@4900 | 1020 | computed style have executed), the style sheet set |
annevk@4900 | 1021 | should be set by using the |
annevk@4900 | 1022 | <span>select a style sheet set</span> set of steps as if the user had |
annevk@4900 | 1023 | selected the set manually.</p> |
annevk@4900 | 1024 | |
annevk@4900 | 1025 | <p class="note">This specification does not give any suggestions on |
annevk@4900 | 1026 | how user agents should decide to persist the style sheet set or whether or |
annevk@4900 | 1027 | how to persist the selected set across pages.</p> |
annevk@4900 | 1028 | |
annevk@4900 | 1029 | <!-- XXX this UI section suggests we may want to introduce a few more |
annevk@4900 | 1030 | idioms --> |
annevk@4900 | 1031 | |
glenn@6229 | 1032 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1033 | |
annevk@4900 | 1034 | <h4>Examples</h4> |
annevk@4900 | 1035 | |
annevk@4900 | 1036 | <div class="example"> |
annevk@4900 | 1037 | <p>Thus, in the following HTML snippet:</p> |
annevk@4900 | 1038 | |
glenn@6346 | 1039 | <pre><link rel="alternate stylesheet" title="foo" href="a"> |
annevk@4900 | 1040 | <link rel="alternate stylesheet" title="bar" href="b"> |
annevk@4900 | 1041 | <script> |
annevk@4900 | 1042 | document.selectedStyleSheetSet = 'foo'; |
annevk@4900 | 1043 | document.styleSheets[1].disabled = false; |
annevk@4900 | 1044 | </script> |
annevk@4900 | 1045 | <link rel="alternate stylesheet" title="foo" href="c"> |
annevk@4900 | 1046 | <link rel="alternate stylesheet" title="bar" href="d"></pre> |
annevk@4900 | 1047 | |
annevk@4900 | 1048 | <p>...the style sheets that end up enabled are style sheets "a", "b", |
annevk@4900 | 1049 | and "c", the |
annevk@4900 | 1050 | <code title="dom-Document-selectedStyleSheetSet">selectedStyleSheetSet</code> |
glenn@6933 | 1051 | attribute would return <code>null</code>, |
annevk@4900 | 1052 | <code title="dom-Document-lastStyleSheetSet">lastStyleSheetSet</code> |
annevk@4900 | 1053 | would return "foo", and |
annevk@4900 | 1054 | <code title="dom-Document-preferredStyleSheetSet">preferredStyleSheetSet</code> |
annevk@4900 | 1055 | would return the empty string.</p> |
annevk@4900 | 1056 | |
annevk@4900 | 1057 | <p>Similarly, in the following HTML snippet:</p> |
annevk@4900 | 1058 | |
glenn@6346 | 1059 | <pre><link rel="alternate stylesheet" title="foo" href="a"> |
annevk@4900 | 1060 | <link rel="alternate stylesheet" title="bar" href="b"> |
annevk@4900 | 1061 | <script> |
annevk@4900 | 1062 | var before = document.preferredStyleSheetSet; |
annevk@4900 | 1063 | document.styleSheets[1].disabled = false; |
annevk@4900 | 1064 | </script> |
annevk@4900 | 1065 | <link rel="stylesheet" title="foo" href="c"> |
annevk@4900 | 1066 | <link rel="alternate stylesheet" title="bar" href="d"> |
annevk@4900 | 1067 | <script> |
annevk@4900 | 1068 | var after = document.preferredStyleSheetSet; |
annevk@4900 | 1069 | </script></pre> |
annevk@4900 | 1070 | |
annevk@4900 | 1071 | <p>...the "before" variable will be equal to the empty string, the |
annevk@4900 | 1072 | "after" variable will be equal to "foo", and style sheets "a" and "c" |
annevk@4900 | 1073 | will be enabled. This is the case even though the first script block |
annevk@4900 | 1074 | sets style sheet "b" to be enabled, because upon parsing the |
annevk@4900 | 1075 | following <code><link></code> element, the |
annevk@4900 | 1076 | <code title="dom-Document-preferredStyleSheetSet">preferredStyleSheetSet</code> |
annevk@4900 | 1077 | is set and the |
annevk@4900 | 1078 | <code title="dom-Document-enableStyleSheetsForSet">enableStyleSheetsForSet()</code> |
annevk@4900 | 1079 | method is called (since |
annevk@4900 | 1080 | <code title="dom-Document-selectedStyleSheetSet">selectedStyleSheetSet</code> |
annevk@4900 | 1081 | was never set |
annevk@4900 | 1082 | explicitly, leaving |
annevk@4900 | 1083 | <code title="dom-Document-lastStyleSheetSet">lastStyleSheetSet</code> at |
glenn@6933 | 1084 | <code>null</code> throughout), which changes which style sheets are enabled and which |
annevk@4900 | 1085 | are not.</p> |
annevk@4900 | 1086 | </div> |
annevk@4900 | 1087 | |
glenn@6229 | 1088 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1089 | <!-- ........................................................................................................................ --> |
annevk@4900 | 1090 | |
annevk@4900 | 1091 | <h3>Style Sheet Association</h3> |
annevk@4900 | 1092 | |
annevk@4903 | 1093 | <p>This section defines the interface a |
annevk@4903 | 1094 | <span>style sheet owner node</span> of a <span>style sheet</span> has to |
annevk@4903 | 1095 | implement and defines the requirements for |
annevk@4903 | 1096 | <span data-anolis-spec=xmlss title="xml-stylesheet processing instruction">xml-stylesheet processing instructions</span> |
annevk@4900 | 1097 | and HTTP <code title="http-link">Link</code> headers when the link |
annevk@4903 | 1098 | relation type is an |
annevk@4914 | 1099 | <span data-anolis-spec=dom>ASCII case-insensitive</span> match for |
glenn@6229 | 1100 | "<code>stylesheet</code>" since nobody else was interested in |
annevk@4900 | 1101 | defining this.</p> |
annevk@4900 | 1102 | |
annevk@4903 | 1103 | <p class=note>The editor is in good hope that HTML and SVG will define the |
annevk@4900 | 1104 | appropriate processing in their respective specifications, in terms of |
annevk@4900 | 1105 | this specification, in due course.</p> |
annevk@4900 | 1106 | |
annevk@4900 | 1107 | |
glenn@6229 | 1108 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1109 | |
glenn@6229 | 1110 | <h4>The <code>LinkStyle</code> Interface</h4> |
glenn@6229 | 1111 | |
glenn@6229 | 1112 | <!--{@idl(LinkStyle)}--> |
annevk@4900 | 1113 | |
annevk@4900 | 1114 | <div class="example"> |
glenn@7307 | 1115 | <p>In the following fragment, the first <code>style</code> |
annevk@4900 | 1116 | element has a <code>sheet</code> attribute that returns a |
annevk@4900 | 1117 | <code>StyleSheet</code> object representing the style sheet, but for |
glenn@7307 | 1118 | the second <code>style</code> element, the <code>style</code> attribute returns <code>null</code>, |
glenn@7307 | 1119 | assuming the user agent supports CSS (<code>text/css</code>), but does |
glenn@7307 | 1120 | not support the (hypothetical) ExampleSheets (<code>text/example-sheets</code>).</p> |
annevk@4900 | 1121 | |
glenn@7307 | 1122 | <pre><style type="text/css"> |
glenn@7307 | 1123 | body { background:lime } |
glenn@7307 | 1124 | </style></pre> |
glenn@7307 | 1125 | <pre><style type="text/example-sheets"> |
glenn@7307 | 1126 | $(body).background := lime |
glenn@7307 | 1127 | </style></pre> |
annevk@4900 | 1128 | </div> |
annevk@4900 | 1129 | |
annevk@4900 | 1130 | <p class="note">Whether or not the node refers to a style sheet is defined |
annevk@4900 | 1131 | by the specification that defines the semantics of said node.</p> |
annevk@4900 | 1132 | |
glenn@6229 | 1133 | <!-- ........................................................................................................................ --> |
annevk@4900 | 1134 | |
annevk@4900 | 1135 | <h4>Requirements on specifications</h4> |
annevk@4900 | 1136 | |
annevk@4900 | 1137 | <p>Specifications introducing new ways of associating style sheets through |
annevk@4900 | 1138 | the DOM should define which nodes implement the |
annevk@4900 | 1139 | <code>LinkStyle</code> interface. When doing so, they |
annevk@4900 | 1140 | must also define when a <span>style sheet</span> is |
annevk@4900 | 1141 | <span title="create a style sheet">created</span>.</p> |
annevk@4900 | 1142 | |
annevk@4900 | 1143 | |
annevk@4900 | 1144 | |
annevk@4900 | 1145 | |
glenn@6229 | 1146 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1147 | |
annevk@4900 | 1148 | <h4>Requirements on User Agents Implementing the |
glenn@6229 | 1149 | <span><code>xml-stylesheet</code> processing instruction</span></h4> |
annevk@4900 | 1150 | |
annevk@4900 | 1151 | <!-- XXX load/error events, reparse --> |
annevk@4900 | 1152 | |
glenn@6229 | 1153 | <!--{@idl(ProcessingInstruction)}--> |
glenn@6229 | 1154 | |
glenn@6229 | 1155 | <!-- |
annevk@4914 | 1156 | <pre class="idl"><span data-anolis-spec=dom>ProcessingInstruction</span> implements <span>LinkStyle</span>;</pre> |
glenn@6229 | 1157 | --> |
annevk@4900 | 1158 | |
annevk@4900 | 1159 | <p>For each |
annevk@4903 | 1160 | <span data-anolis-spec=xmlss><code>xml-stylesheet</code> processing instruction</span> |
annevk@4903 | 1161 | that is not part of the |
annevk@4903 | 1162 | <span data-anolis-spec=xml>document type declaration</span> and has an |
glenn@6229 | 1163 | <code>href</code> |
annevk@4903 | 1164 | <span data-anolis-spec=xmlss>pseudo-attribute</span> these steps must |
annevk@4903 | 1165 | (unless otherwise stated) be run:</p> |
annevk@4900 | 1166 | |
annevk@4900 | 1167 | <ol> |
glenn@6229 | 1168 | <li><p>Let <var>title</var> be the value of the |
glenn@6229 | 1169 | <code>title</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> or the empty string if the |
glenn@6229 | 1170 | <code>title</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> is not specified.</p></li> |
glenn@6229 | 1171 | |
glenn@6229 | 1172 | <li><p>If there is an <code>alternate</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> |
annevk@4914 | 1173 | whose value is a <span data-anolis-spec=dom>case-sensitive</span> match |
glenn@6229 | 1174 | for "<code>yes</code>" and <var>title</var> is the |
annevk@4900 | 1175 | empty string terminate these steps.</p></li> |
annevk@4900 | 1176 | |
glenn@6229 | 1177 | <li><p>If there is a <code>type</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> whose |
annevk@4900 | 1178 | value is not a <span>supported styling language</span> the user agent |
annevk@4900 | 1179 | may terminate these steps.</p></li> |
annevk@4900 | 1180 | |
annevk@4900 | 1181 | <li><p><span data-anolis-spec=html title="Resolve a URL">Resolve</span> |
annevk@4900 | 1182 | the <span data-anolis-spec=html>URL</span> specified by the |
glenn@6229 | 1183 | <code>href</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> and then |
annevk@4900 | 1184 | <span data-anolis-spec=html>fetch</span> it.</p></li> |
annevk@4900 | 1185 | |
annevk@4900 | 1186 | <li> |
annevk@4900 | 1187 | <p>When the resource is available, the document is in |
glenn@6935 | 1188 | <span data-anolis-spec=html>quirks mode</span> |
annevk@4903 | 1189 | and the |
glenn@6935 | 1190 | <span data-anolis-spec=html title="content-type">Content-Type metadata</span> of |
annevk@4900 | 1191 | the resource is not a <span>supported styling language</span> change the |
glenn@6935 | 1192 | <span data-anolis-spec=html title="content-type">Content-Type metadata</span> of the resource |
glenn@6229 | 1193 | to <code>text/css</code>.</p> |
annevk@4900 | 1194 | |
annevk@4900 | 1195 | <p class="note">This step might never actually happen, but is included |
annevk@4900 | 1196 | here in case other specifications change, to keep things consistent.</p> |
annevk@4900 | 1197 | </li> |
annevk@4900 | 1198 | |
annevk@4900 | 1199 | <li><p>If the resource is not in a |
annevk@4900 | 1200 | <span>supported styling language</span> terminate these steps.</p></li> |
annevk@4900 | 1201 | |
annevk@4900 | 1202 | <li> |
annevk@4900 | 1203 | <p><span>Create a style sheet</span> with the following properties:</p> |
annevk@4900 | 1204 | |
annevk@4900 | 1205 | <dl> |
annevk@4900 | 1206 | <dt><span>style sheet location</span></dt> |
annevk@4900 | 1207 | <dd><p>The <span data-anolis-spec=html>absolute URL</span> of the |
annevk@4900 | 1208 | resource.</p></dd> |
annevk@4900 | 1209 | |
annevk@4900 | 1210 | <dt><span>style sheet parent</span></dt> |
glenn@6933 | 1211 | <dd><p><code>null</code></p></dd> |
annevk@4900 | 1212 | |
annevk@4900 | 1213 | <dt><span>style sheet owner node</span></dt> |
annevk@4900 | 1214 | <dd><p>The node.</p></dd> |
annevk@4900 | 1215 | |
annevk@4900 | 1216 | <dt><span>style sheet owner CSS rule</span></dt> |
glenn@6933 | 1217 | <dd><p><code>null</code></p></dd> |
annevk@4900 | 1218 | |
annevk@4900 | 1219 | <dt><span>style sheet media</span></dt> |
glenn@6229 | 1220 | <dd><p>The value of the <code>media</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> |
annevk@4900 | 1221 | if any, or the empty string otherwise.</p></dd> |
annevk@4900 | 1222 | |
annevk@4900 | 1223 | <dt><span>style sheet title</span></dt> |
glenn@6229 | 1224 | <dd><p><var>title</var></p></dd> |
annevk@4900 | 1225 | |
annevk@4900 | 1226 | <dt><span>style sheet alternate flag</span></dt> |
glenn@6229 | 1227 | <dd><p>Set if the <code>alternate</code> <span data-anolis-spec=xmlss>pseudo-attribute</span> |
annevk@4914 | 1228 | value is a <span data-anolis-spec=dom>case-sensitive</span> match for |
glenn@6933 | 1229 | "<code>yes</code>", or clear otherwise. |
annevk@4900 | 1230 | </dl> |
annevk@4900 | 1231 | </li> |
annevk@4900 | 1232 | </ol> |
annevk@4900 | 1233 | |
annevk@4900 | 1234 | |
annevk@4900 | 1235 | |
glenn@6229 | 1236 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1237 | |
annevk@4900 | 1238 | <h4>Requirements on User Agents Implementing the HTTP |
glenn@6229 | 1239 | <code>Link</code> Header</h4> |
annevk@4900 | 1240 | |
annevk@4900 | 1241 | <!-- XXX ref, one day --> |
annevk@4900 | 1242 | |
annevk@4900 | 1243 | <!-- XXX deal with media param --> |
annevk@4900 | 1244 | |
annevk@4900 | 1245 | <p>For each HTTP <code title="http-link">Link</code> header of which one |
annevk@4900 | 1246 | of the link relation types is an |
annevk@4914 | 1247 | <span data-anolis-spec=dom>ASCII case-insensitive</span> match |
glenn@6229 | 1248 | for "<code>stylesheet</code>" these steps |
annevk@4900 | 1249 | must be run:</p> |
annevk@4900 | 1250 | |
annevk@4900 | 1251 | <ol> |
glenn@6229 | 1252 | <li><p>Let <var>title</var> be the value of the first of all the |
glenn@6229 | 1253 | <code>title</code> and <code>title*</code> parameters. |
annevk@4900 | 1254 | If there are no such parameters it is the empty string.</p></li> |
annevk@4900 | 1255 | |
annevk@4900 | 1256 | <li><p>If one of the (other) link relation types is an |
annevk@4914 | 1257 | <span data-anolis-spec=dom>ASCII case-insensitive</span> match for |
glenn@6229 | 1258 | "<code>alternate</code>" and <var>title</var> is the |
annevk@4900 | 1259 | empty string terminate these steps.</p></li> |
annevk@4900 | 1260 | |
annevk@4900 | 1261 | <li><p><span data-anolis-spec=html title="Resolve a URL">Resolve</span> |
annevk@4900 | 1262 | the specified <span data-anolis-spec=html>URL</span> and |
annevk@4900 | 1263 | <span data-anolis-spec=html>fetch</span> it.</p></li> |
annevk@4900 | 1264 | |
annevk@4900 | 1265 | <li><p>When the resource is available, the document is in |
glenn@6935 | 1266 | <span data-anolis-spec=html>quirks mode</span> |
glenn@6935 | 1267 | and the <span data-anolis-spec=html title="content-type">Content-Type metadata</span> of |
annevk@4900 | 1268 | the resource is not a <span>supported styling language</span> change the |
glenn@6935 | 1269 | <span data-anolis-spec=html title="content-type">Content-Type metadata</span> of the resource |
glenn@6229 | 1270 | to <code>text/css</code>.</p></li> |
annevk@4900 | 1271 | |
annevk@4900 | 1272 | <li><p>If the resource is not in a |
annevk@4900 | 1273 | <span>supported styling language</span> terminate these steps.</p></li> |
annevk@4900 | 1274 | |
annevk@4900 | 1275 | <li> |
annevk@4900 | 1276 | <p><span>Create a style sheet</span> with the following properties:</p> |
annevk@4900 | 1277 | |
annevk@4900 | 1278 | <dl> |
annevk@4900 | 1279 | <dt><span>style sheet location</span></dt> |
annevk@4900 | 1280 | <dd><p>The <span data-anolis-spec=html>absolute URL</span> of the |
annevk@4900 | 1281 | resource.</p></dd> |
annevk@4900 | 1282 | |
annevk@4900 | 1283 | <dt><span>style sheet owner node</span></dt> |
glenn@6933 | 1284 | <dd><p><code>null</code></p></dd> |
annevk@4900 | 1285 | |
annevk@4900 | 1286 | <dt><span>style sheet parent</span></dt> |
glenn@6933 | 1287 | <dd><p><code>null</code></p></dd> |
annevk@4900 | 1288 | |
annevk@4900 | 1289 | <dt><span>style sheet owner CSS rule</span></dt> |
glenn@6933 | 1290 | <dd><p><code>null</code></p></dd> |
annevk@4900 | 1291 | |
annevk@4900 | 1292 | <dt><span>style sheet media</span></dt> |
glenn@6229 | 1293 | <dd><p>The value of the first <code>media</code> parameter.</p></dd> |
annevk@4900 | 1294 | <!-- XXX register media parameter? bah --> |
annevk@4900 | 1295 | |
annevk@4900 | 1296 | <dt><span>style sheet title</span></dt> |
glenn@6229 | 1297 | <dd><p><var>title</var></p></dd> |
annevk@4900 | 1298 | |
annevk@4900 | 1299 | <dt><span>style sheet alternate flag</span></dt> |
annevk@4917 | 1300 | <dd><p>Set if one of the specified link relation type for this HTTP |
annevk@4900 | 1301 | <code title="http-link">Link</code> header is an |
annevk@4914 | 1302 | <span data-anolis-spec=dom>ASCII case-insensitive</span> match for |
glenn@6229 | 1303 | "<code>alternate</code>", or false otherwise. |
annevk@4900 | 1304 | </dl> |
annevk@4900 | 1305 | </li> |
annevk@4900 | 1306 | </ol> |
annevk@4900 | 1307 | |
glenn@6229 | 1308 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1309 | <!-- ........................................................................................................................ --> |
annevk@4900 | 1310 | |
annevk@4900 | 1311 | <h3>CSS Rules</h3> |
annevk@4900 | 1312 | |
glenn@6794 | 1313 | <p>A <dfn id="rule">CSS rule</dfn> is an abstract concept that |
glenn@6933 | 1314 | denotes a rule as defined by the CSS specification. A |
glenn@6794 | 1315 | <span>CSS rule</span> is represented as an object that implements a subclass of |
glenn@6933 | 1316 | the <code>CSSRule</code> interface, and which has the following |
glenn@6794 | 1317 | associated state items:</p> |
glenn@6794 | 1318 | |
glenn@6794 | 1319 | <dl> |
glenn@6794 | 1320 | <dt><dfn id="rule-type">rule type</dfn></dt> |
glenn@6794 | 1321 | <dd><p>A non-negative integer associated with a particular type of rule. |
glenn@6794 | 1322 | This item is initialized when a rule is created and must never change.</p></dd> |
glenn@6794 | 1323 | |
glenn@6794 | 1324 | <dt><dfn id="rule-text">rule text</dfn></dt> |
glenn@6794 | 1325 | <dd><p>A text representation of the rule suitable for direct use in a style sheet. |
glenn@6794 | 1326 | This item is initialized when a rule is created, and may change over the lifetime of the rule.</p></dd> |
glenn@6794 | 1327 | |
glenn@6794 | 1328 | <dt><dfn id="rule-parent">rule parent</dfn></dt> |
glenn@6794 | 1329 | <dd><p>An optional reference to another, enclosing <span>CSS rule</span>. |
glenn@6933 | 1330 | If the rule has an enclosing rule when it is created, then this item is initialized to the enclosing rule; otherwise it is <code>null</code>. |
glenn@6933 | 1331 | Subsequent to initialization, this item is reset to <code>null</code> if the rule becomes non-enclosed. Once reset to <code>null</code>, it must never change.</p></dd> |
glenn@6794 | 1332 | |
glenn@6794 | 1333 | <dt><dfn id="rule-style-sheet">rule parent style sheet</dfn></dt> |
glenn@6794 | 1334 | <dd><p>An optional reference to an associated <span>CSS style sheet</span>. |
glenn@6794 | 1335 | This item is initialized to reference an associated style sheet when the rule is created. Subsequent to initialization, this item |
glenn@6933 | 1336 | is reset to <code>null</code> if the rule becomes disassociated from its initial style sheet. Once reset to <code>null</code>, it must never change.</p></dd> |
glenn@6794 | 1337 | </dl> |
glenn@6794 | 1338 | |
glenn@6794 | 1339 | <p>In addition to the above state, each <span>CSS rule</span> may be associated |
glenn@6933 | 1340 | with other state in accordance with its <span>rule type</span>.</p> |
glenn@6794 | 1341 | |
annevk@4900 | 1342 | <p>To <dfn>parse a CSS rule</dfn> ...</p> |
annevk@4900 | 1343 | |
glenn@6899 | 1344 | <p class="issue">Should a rule be instantiated in OM if there is a parse error? To |
glenn@6899 | 1345 | what extent should original (but non-valid) CSS text be captured in cssText?</p> |
glenn@6899 | 1346 | |
glenn@6942 | 1347 | <p>To <dfn>serialize a CSS rule</dfn>, perform one of the following in accordance with the <span title="rule type">rule's type</span>:</p> |
annevk@4900 | 1348 | |
annevk@4900 | 1349 | <dl class="switch"> |
annevk@4900 | 1350 | <dt><code>CSSStyleRule</code></dt> |
glenn@6935 | 1351 | <dd> |
glenn@6935 | 1352 | <p>The result of concatenating the following:</p> |
glenn@6935 | 1353 | <ol> |
glenn@6935 | 1354 | <li>The result of performing <span>serialize a group of selectors</span> on the rule's associated selectors.</li> |
glenn@6935 | 1355 | <li>The string "<code> { </code>", i.e., a single SPACE (U+0020), followed by LEFT CURLY BRACKET (U+007B), |
glenn@6935 | 1356 | followed by a single SPACE (U+0020).</li> |
glenn@6935 | 1357 | <li>The result of performing <span>serialize a CSS declaration block</span> on the rule's associated declarations.</li> |
glenn@6935 | 1358 | <li>If the rule is associated with one or more declarations, the string "<code> </code>", i.e., a single SPACE (U+0020).</li> |
glenn@6935 | 1359 | <li>The string "<code>}</code>", RIGHT CURLY BRACKET (U+007D). |
glenn@6935 | 1360 | </ol> |
glenn@6935 | 1361 | </dd> |
glenn@6523 | 1362 | |
glenn@6523 | 1363 | <dt><code>CSSCharsetRule</code></dt> |
glenn@6935 | 1364 | <dd> |
glenn@6935 | 1365 | <p>The result of concatenating the following:</p> |
glenn@6935 | 1366 | <ol> |
glenn@6935 | 1367 | <li>The string "<code>@charset</code>" followed by a single SPACE (U+0020).</li> |
glenn@6935 | 1368 | <li>The result of performing <span>serialize a string</span> on the <span data-anolis-spec=html>preferred MIME name</span> of the rule's encoding.</li> |
glenn@6935 | 1369 | <li>The string "<code>;</code>", i.e., SEMICOLON (U+003B). |
glenn@6935 | 1370 | </ol> |
glenn@6935 | 1371 | <div class="example"> |
glenn@6935 | 1372 | <pre>@charset "UTF-8";</pre> |
glenn@6935 | 1373 | </div> |
glenn@6935 | 1374 | </dd> |
annevk@4900 | 1375 | |
annevk@4900 | 1376 | <dt><code>CSSImportRule</code></dt> |
annevk@4900 | 1377 | <dd> |
glenn@6935 | 1378 | <p>The result of concatenating the following:</p> |
annevk@4900 | 1379 | <ol> |
glenn@6942 | 1380 | <li>The string "<code>@import</code>" followed by a single SPACE (U+0020).</li> |
glenn@6942 | 1381 | <li>The result of performing <span>serialize a URL</span> on the rule's location.</li> |
glenn@6942 | 1382 | <li>If the rule's associated media list is not empty, a single SPACE (U+0020) followed by the |
glenn@6942 | 1383 | result of performing <span>serialize a media query list</span> on the media list. |
glenn@6942 | 1384 | <li>The string "<code>;</code>", i.e., SEMICOLON (U+003B). |
annevk@4900 | 1385 | </ol> |
glenn@6942 | 1386 | <div class="example"> |
glenn@7306 | 1387 | <pre>@import url("import.css");</pre> |
glenn@6942 | 1388 | <pre>@import url("print.css") print;</pre> |
glenn@6942 | 1389 | </div> |
annevk@4900 | 1390 | </dd> |
annevk@4900 | 1391 | |
annevk@4900 | 1392 | <dt><code>CSSMediaRule</code></dt> |
glenn@6523 | 1393 | <dd><p class="issue">...</p></dd> |
annevk@4900 | 1394 | |
annevk@4900 | 1395 | <dt><code>CSSFontFaceRule</code></dt> |
glenn@6523 | 1396 | <dd><p class="issue">...</p></dd> |
annevk@4900 | 1397 | |
annevk@4900 | 1398 | <dt><code>CSSPageRule</code></dt> |
glenn@6523 | 1399 | <dd><p class="issue">...</p></dd> |
annevk@4900 | 1400 | |
annevk@4900 | 1401 | <dt><code>CSSNamespaceRule</code></dt> |
glenn@6934 | 1402 | <dd><p>The literal string "<code>@namespace</code>", followed by a single SPACE |
annevk@4900 | 1403 | (U+0020), followed by the |
annevk@4900 | 1404 | <span title="serialize an identifier">identifier escaped</span> value of the |
annevk@4900 | 1405 | <code title="dom-CSSNamespaceRule-prefix">prefix</code> attribute (if |
glenn@6934 | 1406 | any), followed by a single SPACE (U+0020) if there is a prefix, followed by the |
annevk@4900 | 1407 | <span title="serialize a URL">URL escaped</span> value of the |
annevk@4900 | 1408 | <code title="dom-CSSNamespaceRule-namespaceURI">namespaceURI</code> |
annevk@4900 | 1409 | attribute, followed the character "<code>;</code>" (U+003B).</p></dd> |
annevk@4900 | 1410 | </dl> |
annevk@4900 | 1411 | |
glenn@6229 | 1412 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1413 | |
glenn@6229 | 1414 | <h4>The <code>CSSRuleList</code> Sequence</h4> |
glenn@6229 | 1415 | |
glenn@6229 | 1416 | <!--{@idl(CSSRuleList)}--> |
glenn@6229 | 1417 | |
glenn@6229 | 1418 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1419 | |
glenn@6229 | 1420 | <h4>The <code>CSSRule</code> Interface</h4> |
glenn@6229 | 1421 | |
glenn@6229 | 1422 | <!--{@idl(CSSRule)}--> |
glenn@6229 | 1423 | |
glenn@6229 | 1424 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1425 | |
glenn@6229 | 1426 | <h4>The <code>CSSStyleRule</code> Interface</h4> |
glenn@6229 | 1427 | |
glenn@6229 | 1428 | <!--{@idl(CSSStyleRule)}--> |
glenn@6229 | 1429 | |
glenn@6229 | 1430 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1431 | |
glenn@6523 | 1432 | <h4>The <code>CSSCharsetRule</code> Interface</h4> |
glenn@6523 | 1433 | |
glenn@6523 | 1434 | <!--{@idl(CSSCharsetRule)}--> |
glenn@6523 | 1435 | |
glenn@6523 | 1436 | <!-- ........................................................................................................................ --> |
glenn@6523 | 1437 | |
glenn@6229 | 1438 | <h4>The <code>CSSImportRule</code> Interface</h4> |
glenn@6229 | 1439 | |
glenn@6229 | 1440 | <!--{@idl(CSSImportRule)}--> |
glenn@6229 | 1441 | |
glenn@6229 | 1442 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1443 | |
glenn@6229 | 1444 | <h4>The <code>CSSMediaRule</code> Interface</h4> |
glenn@6229 | 1445 | |
glenn@6229 | 1446 | <!--{@idl(CSSMediaRule)}--> |
glenn@6229 | 1447 | |
glenn@6229 | 1448 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1449 | |
glenn@6229 | 1450 | <h4>The <code>CSSFontFaceRule</code> Interface</h4> |
glenn@6229 | 1451 | |
glenn@6229 | 1452 | <!--{@idl(CSSFontFaceRule)}--> |
glenn@6229 | 1453 | |
glenn@6229 | 1454 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1455 | |
glenn@6229 | 1456 | <h4>The <code>CSSPageRule</code> Interface</h4> |
glenn@6229 | 1457 | |
glenn@6229 | 1458 | <!--{@idl(CSSPageRule)}--> |
glenn@6229 | 1459 | |
glenn@6229 | 1460 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1461 | |
glenn@6229 | 1462 | <h4>The <code>CSSNamespaceRule</code> Interface</h4> |
glenn@6229 | 1463 | |
glenn@6229 | 1464 | <!--{@idl(CSSNamespaceRule)}--> |
glenn@6229 | 1465 | |
glenn@6229 | 1466 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1467 | <!-- ........................................................................................................................ --> |
annevk@4900 | 1468 | |
annevk@4900 | 1469 | <h3>CSS Declaration Blocks</h3> |
annevk@4900 | 1470 | |
annevk@4900 | 1471 | <p>A <dfn>CSS declaration block</dfn> is an ordered collection of CSS |
annevk@4900 | 1472 | properties with their associated values, also named CSS declarations. In |
annevk@4900 | 1473 | the DOM a <span>CSS declaration block</span> is a |
annevk@4900 | 1474 | <code>CSSStyleDeclaration</code> object. A |
annevk@4900 | 1475 | <span>CSS declaration block</span> has two associated properties:</p> |
annevk@4900 | 1476 | |
annevk@4900 | 1477 | <dl> |
annevk@4900 | 1478 | <dt><dfn>CSS declaration block readonly flag</dfn></dt> |
glenn@6933 | 1479 | <dd><p>Clear if the object can be manipulated. Set if it can not be |
glenn@6933 | 1480 | manipulated. Unless otherwise stated it is clear.</p></dd> |
annevk@4900 | 1481 | |
annevk@4900 | 1482 | <dt><dfn>CSS declaration block declarations</dfn></dt> |
annevk@4900 | 1483 | <dd><p>The CSS declarations associated with the object.</p></dd> |
annevk@4900 | 1484 | </dl> |
annevk@4900 | 1485 | |
annevk@4900 | 1486 | <p class="note">The <span>CSS declaration block declarations</span> are |
annevk@4900 | 1487 | ordered. This matters for the |
annevk@4900 | 1488 | <code title="dom-CSSStyleDeclaration-item">item()</code> method.</p> |
annevk@4900 | 1489 | |
glenn@6899 | 1490 | <p>To <dfn id="parse-a-css-declaration-block">parse a CSS declaration block</dfn> ...</p> |
annevk@4900 | 1491 | |
glenn@6899 | 1492 | <p class="issue">What should be captured in the cssText of a declaration block which fails |
glenn@6899 | 1493 | to parse?</p> |
annevk@4900 | 1494 | |
glenn@6527 | 1495 | <p>To <dfn id="serialize-a-css-declaration-block">serialize a CSS declaration block</dfn> |
glenn@6527 | 1496 | represented by a <code>CSSStyleDeclarations</code> instance named <var>d</var>, |
glenn@6527 | 1497 | let <var>s</var> be the empty string, then run the steps below:</p> |
annevk@4900 | 1498 | |
glenn@6527 | 1499 | <ol> |
glenn@6527 | 1500 | <li><p>If <code><var>d</var>.length</code> is zero (0), then return <var>s</var>.</p></li> |
glenn@6527 | 1501 | <li><p>For each <var>i</var> from zero (0) through <code><var>d</var>.length</code> - 1 (inclusive), perform the following sub-steps:</p> |
glenn@6527 | 1502 | <ol> |
glenn@6527 | 1503 | <li><p>Let <var>n</var> be the value returned by <code><var>d</var>.item(<var>i</var>)</code>.</p></li> |
glenn@6527 | 1504 | <li><p>Let <var>v</var> be the value returned by <code><var>d</var>.getPropertyValue(<var>n</var>)</code>.</p></li> |
glenn@6527 | 1505 | <li><p>If <var>v</var> is the empty string, then continue.</p></li> |
glenn@6527 | 1506 | <li><p>Otherwise (<var>v</var> is non-empty), perform the following sub-steps:</p> |
glenn@6527 | 1507 | <ol> |
glenn@6934 | 1508 | <li><p>If <var>s</var> is not empty, then append a single SPACE (U+0020) to <var>s</var>.</p></li> |
glenn@6527 | 1509 | <li><p>Append <var>n</var> to <var>s</var>.</p></li> |
glenn@6934 | 1510 | <li><p>Append COLON (U+003A) followed by a single SPACE (U+0020), i.e., "<code>: </code>", to <var>s</var>.</p></li> |
glenn@6527 | 1511 | <li><p>Append <var>v</var> to <var>s</var>.</p></li> |
glenn@6527 | 1512 | </ol> |
glenn@6527 | 1513 | </li> |
glenn@6534 | 1514 | <li><p>Let <var>p</var> be the value returned by <code><var>d</var>.getPropertyPriority(<var>n</var>)</code>.</p></li> |
glenn@6534 | 1515 | <li><p>If <var>p</var> is not the empty string, then perform the following sub-steps:</p> |
glenn@6534 | 1516 | <ol> |
glenn@6934 | 1517 | <li><p>Append a single SPACE (U+0020) followed by EXCLAMATION MARK (U+0021), i.e., "<code> !</code>", to <var>s</var>.</p></li> |
glenn@6534 | 1518 | <li><p>Append <var>p</var> to <var>s</var>.</p></li> |
glenn@6534 | 1519 | </ol> |
glenn@6534 | 1520 | </li> |
glenn@6534 | 1521 | <li><p>Append SEMICOLON (U+003B), i.e., "<code>;</code>", to <var>s</var>.</p></li> |
glenn@6527 | 1522 | </ol> |
glenn@6527 | 1523 | </li> |
glenn@6531 | 1524 | <li><p>Return <var>s</var>.</p></li> |
glenn@6527 | 1525 | </ol> |
annevk@4900 | 1526 | |
glenn@6527 | 1527 | <p class="note">The serialization of an empty CSS declaration block is the empty string.</p> |
glenn@6527 | 1528 | |
glenn@6530 | 1529 | <p class="note">The serialization of a non-empty CSS declaration block does not include any surrounding whitespace, i.e., no whitepsace appears |
glenn@6528 | 1530 | before the first property name and no whitespace appears after the final semicolon delimiter that follows the last property value.</p> |
annevk@4900 | 1531 | |
glenn@6229 | 1532 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1533 | |
glenn@6229 | 1534 | <h4>The <code>CSSStyleDeclaration</code> Interface</h4> |
glenn@6229 | 1535 | |
glenn@6229 | 1536 | <!--{@idl(CSSStyleDeclaration)}--> |
glenn@6229 | 1537 | |
annevk@4916 | 1538 | <hr> |
annevk@4900 | 1539 | |
annevk@4900 | 1540 | <p>For the table below, the IDL attribute in the first column |
annevk@4916 | 1541 | must return the result of invoking |
annevk@4900 | 1542 | <code title="dom-CSSStyleDeclaration-getPropertyValue">getPropertyValue()</code> |
annevk@4900 | 1543 | with as argument the CSS property given in the second column on the same |
annevk@4900 | 1544 | row.</p> |
annevk@4900 | 1545 | |
annevk@4900 | 1546 | <p>Similarly for the table below, setting the IDL attribute in the |
annevk@4916 | 1547 | first column must invoke |
annevk@4916 | 1548 | <code title="dom-CSSStyleDeclaration-setProperty">setProperty()</code> |
annevk@4916 | 1549 | with as first argument the CSS property given in the second column on the |
annevk@4916 | 1550 | same row, as second argument the given value, and no third argument. Any |
annevk@4918 | 1551 | exceptions thrown must be re-thrown.</p> |
annevk@4900 | 1552 | |
glenn@6531 | 1553 | <p class="issue">Restore the entries for the following table or resurrect |
glenn@6531 | 1554 | CSS2Properties (or similar) or define in general terms using prose or ...</p> |
glenn@6531 | 1555 | |
annevk@4900 | 1556 | <table> |
annevk@4900 | 1557 | <thead> |
annevk@4900 | 1558 | <tr> |
annevk@4900 | 1559 | <th>IDL attribute |
annevk@4900 | 1560 | <th>CSS property |
annevk@4900 | 1561 | <tbody> |
annevk@4900 | 1562 | <!--CSSOM-DECLARATIONTABLE--> |
annevk@4900 | 1563 | </table> |
annevk@4900 | 1564 | |
annevk@4900 | 1565 | <!-- |
annevk@4900 | 1566 | <h4>CSS Properties</h4> |
annevk@4900 | 1567 | |
annevk@4900 | 1568 | <p>The DOM attribute name of a CSS property can be found by using the |
annevk@4900 | 1569 | following algorithm:</p> |
annevk@4900 | 1570 | |
annevk@4900 | 1571 | <ol> |
glenn@6229 | 1572 | <li>Let <var>r</var> be the CSS property to be |
annevk@4900 | 1573 | converted.</li> |
annevk@4900 | 1574 | |
annevk@4900 | 1575 | <li>Uppercase the first character after every U+002D (<code>-</code>) in |
glenn@6229 | 1576 | <var>r</var>.</li> |
glenn@6229 | 1577 | |
glenn@6229 | 1578 | <li>Remove every U+002D (<code>-</code>) in <var>r</var>.</li> |
glenn@6229 | 1579 | |
glenn@6229 | 1580 | <li>Return <var>r</var>.</li> |
annevk@4900 | 1581 | </ol> |
annevk@4900 | 1582 | |
annevk@4900 | 1583 | <p class="note">This means that |
glenn@6229 | 1584 | <code>-<var>vendor</var>-<var>property</var></code> |
annevk@4900 | 1585 | becomes |
glenn@6229 | 1586 | <code><var><strong>V</strong>endor</var><var><strong>P</strong>roperty</var></code> |
annevk@4900 | 1587 | for instance.</p> |
annevk@4900 | 1588 | --> |
annevk@4900 | 1589 | |
glenn@6229 | 1590 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1591 | <!-- ........................................................................................................................ --> |
annevk@4900 | 1592 | |
annevk@4900 | 1593 | <h3>CSS Values</h3> |
annevk@4900 | 1594 | |
glenn@6229 | 1595 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1596 | |
annevk@4900 | 1597 | <h4>Parsing CSS Values</h4> |
annevk@4900 | 1598 | |
annevk@4900 | 1599 | <p>To <dfn id="parse-a-css-value">parse a CSS value</dfn> for a given |
glenn@6229 | 1600 | <var>property</var> means to a parse the given value according to |
annevk@4900 | 1601 | the definition of the property that is an |
annevk@4914 | 1602 | <span data-anolis-spec=dom>ASCII case-insensitive</span> match for |
glenn@6229 | 1603 | <var>property</var> in the CSS specification. If the given value |
glenn@6933 | 1604 | is <span>ignored</span> return <code>null</code>. Otherwise return the CSS value for |
glenn@6229 | 1605 | the given <var>property</var>.</p> |
glenn@6229 | 1606 | |
glenn@6229 | 1607 | <p class="note">"<code>!important</code>" declarations are not |
annevk@4900 | 1608 | part of the property value space and will therefore cause |
glenn@6933 | 1609 | <span>parse a CSS value</span> to return <code>null</code>.</p> |
annevk@4900 | 1610 | |
annevk@4900 | 1611 | |
glenn@6229 | 1612 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1613 | |
annevk@4900 | 1614 | <h4>Serializing CSS Values</h4> |
annevk@4900 | 1615 | |
annevk@4900 | 1616 | <!-- based on http://damowmow.com/playground/canon.txt --> |
annevk@4900 | 1617 | |
annevk@4900 | 1618 | <p>To <dfn id="serialize-a-css-value">serialize a CSS value</dfn> follow |
annevk@4900 | 1619 | these rules:</p> |
annevk@4900 | 1620 | |
annevk@4900 | 1621 | <ul> |
annevk@4900 | 1622 | <li><p><span title="Serialize a CSS component value">Serialize</span> any |
annevk@4900 | 1623 | CSS component values in the value.</p></li> |
annevk@4900 | 1624 | |
annevk@4900 | 1625 | <li><p>Where multiple CSS component values can appear in any order |
annevk@4900 | 1626 | without changing the meaning of the value (typically represented by a |
annevk@4900 | 1627 | double bar <code>||</code> in the value syntax), use the order as given |
annevk@4900 | 1628 | in the syntax.</p></li> |
annevk@4900 | 1629 | <!-- <code><border-width> <border-style> <color></code> |
annevk@4900 | 1630 | for <code>border</code> --> |
annevk@4900 | 1631 | |
annevk@4900 | 1632 | <li> |
annevk@4900 | 1633 | <p>Where CSS component values of the value can be omitted without |
annevk@4900 | 1634 | changing the meaning of the value (e.g. initial values in shorthand |
annevk@4900 | 1635 | properties), omit them. If this would remove all the values, then |
annevk@4900 | 1636 | include the first allowed value.</p> |
annevk@4900 | 1637 | |
annevk@4900 | 1638 | <p class="example">E.g. <code>margin: 20px 20px</code> becomes |
annevk@4900 | 1639 | <code>margin: 20px</code>.</p> |
annevk@4900 | 1640 | |
annevk@4900 | 1641 | <p class="example">E.g. the value <code>0</code> for the |
annevk@4900 | 1642 | '<code>border</code>' property.</p> |
annevk@4900 | 1643 | </li> |
annevk@4900 | 1644 | |
annevk@4900 | 1645 | <li><p>If the value of a shorthand property is requested and it cannot be |
annevk@4900 | 1646 | computed because the properties associated with the shorthand have values |
annevk@4900 | 1647 | that cannot be represented by the shorthand the serialization is the |
annevk@4900 | 1648 | empty string.</p></li> |
annevk@4900 | 1649 | |
annevk@4900 | 1650 | <li><p>If a value has a <span>whitespace</span>-separated list of |
annevk@4900 | 1651 | CSS component values, |
annevk@4900 | 1652 | <span title="serialize a whitespace-separated list">serialize</span> the |
annevk@4900 | 1653 | value as a whitespace-separated list.</p></li> |
annevk@4900 | 1654 | |
annevk@4900 | 1655 | <li><p>If a value has a comma-separated list of |
annevk@4900 | 1656 | CSS component values, |
annevk@4900 | 1657 | <span title="serialize a comma-separated list">serialize</span> the |
annevk@4900 | 1658 | value as a comma-separated list.</p></li> |
annevk@4900 | 1659 | </ul> |
annevk@4900 | 1660 | |
annevk@4900 | 1661 | |
annevk@4900 | 1662 | <p>To |
annevk@4900 | 1663 | <dfn id="serialize-a-css-value-component">serialize a CSS component value</dfn> |
annevk@4900 | 1664 | depends on the component, as follows:</p> |
annevk@4900 | 1665 | |
annevk@4900 | 1666 | <dl class="switch"> |
annevk@4900 | 1667 | <dt>keyword</dt> |
annevk@4900 | 1668 | <dd><p>The keyword |
annevk@4914 | 1669 | <span data-anolis-spec=dom>converted to ASCII lowercase</span>.</p></dd> |
annevk@4900 | 1670 | |
annevk@4900 | 1671 | <dt><angle></dt> |
annevk@4900 | 1672 | <dd><p>The number of degrees serialized as per <number> followed by |
annevk@4900 | 1673 | the literal string "<code>deg</code>".</p></dd> |
annevk@4900 | 1674 | |
annevk@4900 | 1675 | <dt><color></dt> |
glenn@6802 | 1676 | <dd> |
glenn@6802 | 1677 | <p>If <color> is a component of a resolved or computed value, then |
glenn@6802 | 1678 | return the color using the <code>rgb()</code> or <code>rgba()</code> functional |
glenn@6802 | 1679 | notation as follows:</p> |
glenn@6802 | 1680 | <ol> |
glenn@6802 | 1681 | <li>If the alpha component of the color is equal to one, then return the serialization of the |
glenn@6802 | 1682 | <code>rgb()</code> functional equivalent of the opaque color.</li> |
glenn@6802 | 1683 | <li>If the alpha component of the color is not equal to one, then return the serialization of the |
glenn@6802 | 1684 | <code>rgba()</code> functional equivalent of the non-opaque color.</li> |
glenn@6802 | 1685 | </ol> |
glenn@6802 | 1686 | <p>The serialization of the <code>rgb()</code> functional equivalent is the concatenation of the following:</p> |
glenn@6802 | 1687 | <ol> |
glenn@6802 | 1688 | <li>The string "<code>rgb(</code>".</li> |
glenn@6809 | 1689 | <li>The shortest base-ten integer serialization of the color's red component.</li> |
glenn@6802 | 1690 | <li>The string "<code>, </code>".</li> |
glenn@6809 | 1691 | <li>The shortest base-ten serialization of the color's green component.</li> |
glenn@6802 | 1692 | <li>The string "<code>, </code>".</li> |
glenn@6809 | 1693 | <li>The shortest base-ten serialization of the color's blue component.</li> |
glenn@6802 | 1694 | <li>The string "<code>)</code>".</li> |
glenn@6802 | 1695 | </ol> |
glenn@6802 | 1696 | <p>The serialization of the <code>rgba()</code> functional equivalent is the concatenation of the following:</p> |
glenn@6802 | 1697 | <ol> |
glenn@6802 | 1698 | <li>The string "<code>rgba(</code>".</li> |
glenn@6809 | 1699 | <li>The shortest base-ten serialization of the color's red component.</li> |
glenn@6802 | 1700 | <li>The string "<code>, </code>".</li> |
glenn@6809 | 1701 | <li>The shortest base-ten serialization of the color's green component.</li> |
glenn@6802 | 1702 | <li>The string "<code>, </code>".</li> |
glenn@6809 | 1703 | <li>The shortest base-ten serialization of the color's blue component.</li> |
glenn@6802 | 1704 | <li>The string "<code>, </code>".</li> |
glenn@6809 | 1705 | <li>The shortest serialization of the <number> that denotes the color's alpha component.</li> |
glenn@6802 | 1706 | <li>The string "<code>)</code>".</li> |
glenn@6802 | 1707 | </ol> |
glenn@6802 | 1708 | |
glenn@6809 | 1709 | <p>In the above rules, the string "<code>, </code>" denotes a COMMA (U+002C) followed by a single SPACE (U+0020).</p> |
glenn@6809 | 1710 | |
glenn@6802 | 1711 | <p>If <color> is a component of a specified value, then |
glenn@6802 | 1712 | return the color as follows:</p> |
glenn@6802 | 1713 | <ol> |
glenn@6802 | 1714 | <li>If the color was explicitly specified by the author, then return the original, author specified color value.</li> |
glenn@6802 | 1715 | <li>Otherwise, return the value that would be returned if the color were a component of a computed value.</li> |
glenn@6802 | 1716 | </ol> |
glenn@6802 | 1717 | <p class="issue">Should author specified values be normalized for case? Or should original case be preserved?</p> |
glenn@6802 | 1718 | </dd> |
annevk@4900 | 1719 | <!-- |
annevk@4900 | 1720 | <dt>It is a system color</dt> |
annevk@4900 | 1721 | |
annevk@4900 | 1722 | <dd>See below (you use the representation given in the specification that |
annevk@4900 | 1723 | defines the keyword).</dd> |
annevk@4900 | 1724 | |
annevk@4900 | 1725 | <dt>Alpha component is equal to 1.0</dt> |
annevk@4900 | 1726 | |
annevk@4900 | 1727 | <dd>The color is an uppercase six-digit hexadecimal value, prefixed with a |
annevk@4900 | 1728 | <code>#</code> character (U+0023 NUMBER SIGN), with the first two digits |
annevk@4900 | 1729 | representing the red component, the next two digits representing the green |
annevk@4900 | 1730 | component, and the last two digits representing the blue component, the |
annevk@4900 | 1731 | digits being in the range 0-9 A-F (U+0030 to U+0039 and U+0041 to |
annevk@4900 | 1732 | U+0046).</dd> |
annevk@4900 | 1733 | |
annevk@4900 | 1734 | <dt>Alpha component is less than 1.0</dt> |
annevk@4900 | 1735 | |
annevk@4900 | 1736 | <dd>The color is in the CSS <code>rgba()</code> functional-notation format: |
annevk@4900 | 1737 | the literal string <code>rgba</code> (U+0072 U+0067 U+0062 U+0061) followed |
annevk@4900 | 1738 | by a U+0028 LEFT PARENTHESIS, a <span>color component integer</span> |
annevk@4900 | 1739 | representing the red component, a <span>color component separator</span>, a |
annevk@4900 | 1740 | <span>color component integer</span> for the green component, a <span>color |
annevk@4900 | 1741 | component separator</span>, a <span>color component integer</span> for the |
annevk@4900 | 1742 | blue component, another <span>color component separator</span> a U+0030 |
annevk@4900 | 1743 | DIGIT ZERO, a U+002E FULL STOP (representing the decimal point), one or |
annevk@4900 | 1744 | more digits in the range 0-9 (U+0030 to U+0039) representing the fractional |
annevk@4900 | 1745 | part of the alpha value, and finally a U+0029 RIGHT PARENTHESIS.</dd> |
annevk@4900 | 1746 | |
annevk@4900 | 1747 | <dt>The keyword <code>transparent</code> is used</dt> |
annevk@4900 | 1748 | |
annevk@4900 | 1749 | <dd>The color is <code>rgba(0, 0, 0, 0)</code>.</dd> |
annevk@4900 | 1750 | --> |
annevk@4900 | 1751 | |
annevk@4900 | 1752 | <dt><counter></dt> |
annevk@4900 | 1753 | <dd> |
annevk@4900 | 1754 | <p>The concatenation of:</p> |
annevk@4900 | 1755 | <ol> |
annevk@4900 | 1756 | <li><p>If <counter> has three CSS component values the string |
glenn@6229 | 1757 | "<code>counters(</code>".</p></li> |
annevk@4900 | 1758 | <li><p>If <counter> has two CSS component values the string |
glenn@6229 | 1759 | "<code>counter(</code>".</p></li> |
annevk@4900 | 1760 | <li><p>The result of |
annevk@4900 | 1761 | <span title="serialize a comma-separated list">serializing</span> the |
annevk@4900 | 1762 | <span title="serialize a CSS component value">serialized</span> |
annevk@4900 | 1763 | CSS component values belonging to <counter> as list while omitting |
annevk@4900 | 1764 | the last CSS component value if it is 'decimal'.</p></li> |
annevk@4900 | 1765 | <li><p>"<code>)</code>" (U+0029).</p></li> |
annevk@4900 | 1766 | </ol> |
annevk@4900 | 1767 | </dd> |
annevk@4900 | 1768 | |
annevk@4900 | 1769 | <dt><frequency></dt> |
annevk@4900 | 1770 | <dd><p>The frequency in hertz serialized as per <number> followed by |
annevk@4900 | 1771 | the literal string "<code>hz</code>".</dd> |
annevk@4900 | 1772 | |
annevk@4900 | 1773 | <dt><identifier></dt> |
annevk@4900 | 1774 | <dd><p>The identifier |
annevk@4900 | 1775 | <span title="serialize an identifier">escaped</span>.</p></dd> |
annevk@4900 | 1776 | |
annevk@4900 | 1777 | <dt><integer></dt> |
annevk@4900 | 1778 | <dd><p>A base-ten integer using digits 0-9 (U+0030 to U+0039) in the |
annevk@4900 | 1779 | shortest form possible, preceded by "<code>-</code>" (U+002D) if it is |
annevk@4900 | 1780 | negative.</p></dd> |
annevk@4900 | 1781 | |
annevk@4900 | 1782 | <dt><length></dt> |
annevk@4900 | 1783 | <dd> |
annevk@4900 | 1784 | <p>A length of zero is represented by the literal string |
annevk@4900 | 1785 | "<code>0px</code>".</p> |
annevk@4900 | 1786 | |
annevk@4900 | 1787 | <p>Absolute lengths: the number of millimeters serialized as per |
glenn@6344 | 1788 | <number> followed by the literal string "<code>mm</code>".</p> |
glenn@6344 | 1789 | <p class="issue">Rumor has it absolute lengths will become relative |
annevk@4900 | 1790 | lengths. Centimeters would be compatible with <resolution>...</p> |
annevk@4900 | 1791 | |
annevk@4900 | 1792 | <p>Relative lengths: the <number> component serialized as per |
annevk@4900 | 1793 | <number> followed by the unit in its canonical form as defined in its |
annevk@4900 | 1794 | respective specification.</p> |
annevk@4900 | 1795 | </dd> |
annevk@4900 | 1796 | |
annevk@4900 | 1797 | <dt><number></dt> |
glenn@6344 | 1798 | <dd><p class="issue">Browsers seem to use ToString(), but that might give a |
annevk@4900 | 1799 | significand which according to some is teh evil (and also currently does |
annevk@4900 | 1800 | not parse correctly).</p></dd> |
annevk@4900 | 1801 | |
annevk@4900 | 1802 | <dt><percentage></dt> |
annevk@4900 | 1803 | <dd><p>The <number> component serialized as per <number> followed |
annevk@4900 | 1804 | by the literal string "<code>%</code>" (U+0025).</p></dd> |
annevk@4900 | 1805 | |
annevk@4900 | 1806 | <dt><resolution></dt> |
annevk@4900 | 1807 | <dd><p>The resolution in dots per centimeter serialized as per |
annevk@4900 | 1808 | <number> followed by the literal string "<code>dpcm</code>".</dd> |
annevk@4900 | 1809 | |
annevk@4900 | 1810 | <dt><shape></dt> |
glenn@6229 | 1811 | <dd><p>The string "<code>rect(</code>", followed by the result |
annevk@4900 | 1812 | of <span title="serialize a comma-separated list">serializing</span> the |
annevk@4900 | 1813 | <span title="serialize a CSS component value">serialized</span> |
annevk@4900 | 1814 | CSS component values belonging to <shape> as list, followed by |
annevk@4900 | 1815 | "<code>)</code>" (U+0029).</p></dd> |
annevk@4900 | 1816 | |
annevk@4900 | 1817 | <dt><string></dt> |
annevk@4900 | 1818 | <dt><family-name></dt> |
annevk@4900 | 1819 | <dt><specific-voice></dt> |
annevk@4900 | 1820 | <dd><p>The string |
annevk@4900 | 1821 | <span title="serialize a string">string escaped</span>.</p></dd> |
annevk@4900 | 1822 | |
annevk@4900 | 1823 | <dt><time></dt> |
annevk@4900 | 1824 | <dd><p>The time in seconds serialized as per <number> followed by |
annevk@4900 | 1825 | the literal string "<code>s</code>".</dd> |
annevk@4900 | 1826 | |
annevk@4900 | 1827 | <dt><uri></dt> |
annevk@4900 | 1828 | <dd><p>The <span data-anolis-spec=html>absolute URL</span> |
annevk@4900 | 1829 | <span title="serialize a URL">URL escaped</span>.</p></dd> |
annevk@4900 | 1830 | </dl> |
annevk@4900 | 1831 | |
annevk@4900 | 1832 | <p> |
annevk@4900 | 1833 | <absolute-size>, |
annevk@4900 | 1834 | <border-width>, |
annevk@4900 | 1835 | <border-style>, |
annevk@4900 | 1836 | <bottom>, |
annevk@4900 | 1837 | <generic-family>, |
annevk@4900 | 1838 | <generic-voice>, |
annevk@4900 | 1839 | <left>, |
annevk@4900 | 1840 | <margin-width>, |
annevk@4900 | 1841 | <padding-width>, |
annevk@4900 | 1842 | <relative-size>, |
annevk@4900 | 1843 | <right>, and |
annevk@4900 | 1844 | <top>, |
annevk@4900 | 1845 | are considered macros by this specification. They all represent instances |
annevk@4900 | 1846 | of components outlined above.</p> |
annevk@4900 | 1847 | |
glenn@6344 | 1848 | <p class="issue">One idea is that we can remove this section somewhere in |
annevk@4900 | 1849 | the CSS3/CSS4 timeline by moving the above definitions to the drafts that |
annevk@4900 | 1850 | define the CSS components.</p> |
annevk@4900 | 1851 | |
annevk@4900 | 1852 | |
annevk@4900 | 1853 | <h5>Examples</h5> |
annevk@4900 | 1854 | |
annevk@4900 | 1855 | <p>Here are some examples of before and after results on specified values. |
annevk@4900 | 1856 | The before column could be what the author wrote in a style sheet, while |
annevk@4900 | 1857 | the after column shows what querying the DOM would return.</p> |
annevk@4900 | 1858 | |
annevk@4900 | 1859 | <div class="example"> |
annevk@4900 | 1860 | <table> |
annevk@4900 | 1861 | <thead> |
annevk@4900 | 1862 | <tr><th>Before<th>After |
annevk@4900 | 1863 | <tbody> |
annevk@4900 | 1864 | <tr><td><code>background: none</code><td><code>background: rgba(0, 0, 0, 0)</code> |
annevk@4900 | 1865 | <tr><td><code>outline: none</code><td><code>outline: invert</code> |
annevk@4900 | 1866 | <tr><td><code>border: none</code><td><code>border: medium</code> |
annevk@4900 | 1867 | <tr><td><code>list-style: none</code><td><code>list-style: disc</code> |
annevk@4900 | 1868 | <tr><td><code>margin: 0 1px 1px 1px</code><td><code>margin: 0px 1px 1px</code> |
annevk@4900 | 1869 | <tr><td><code>azimuth: behind left</code><td><code>azimuth: 220deg</code> |
annevk@4900 | 1870 | <tr><td><code>font-family: a, 'b"', serif</code><td><code>font-family: "a", "b\"", serif</code> |
annevk@4900 | 1871 | <tr><td><code>content: url('h)i') '\[\]'</code><td><code>content: url("h)i") "[]"</code> |
annevk@4900 | 1872 | <tr><td><code>azimuth: leftwards</code><td><code>azimuth: leftwards</code> |
annevk@4900 | 1873 | <tr><td><code>color: rgb(18, 52, 86)</code><td><code>color: #123456</code> |
annevk@4900 | 1874 | <tr><td><code>color: rgba(000001, 0, 0, 1)</code><td><code>color: #000000</code> |
annevk@4900 | 1875 | </table> |
annevk@4900 | 1876 | |
glenn@6344 | 1877 | <p class="issue">Some of these need to be updated per the new rules.</p> |
annevk@4900 | 1878 | </div> |
annevk@4900 | 1879 | |
glenn@6229 | 1880 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 1881 | |
annevk@4900 | 1882 | <h2>DOM Access to CSS Declaration Blocks</h2> |
annevk@4900 | 1883 | |
glenn@6229 | 1884 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1885 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1886 | |
annevk@4900 | 1887 | <h3>The <code>ElementCSSInlineStyle</code> Interface</h3> |
annevk@4900 | 1888 | |
glenn@6229 | 1889 | <!--{@idl(ElementCSSInlineStyle)}--> |
glenn@6229 | 1890 | |
glenn@6229 | 1891 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1892 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1893 | |
glenn@6229 | 1894 | <h3>Extensions to the <code>Window</code> Interface</h3> |
glenn@6229 | 1895 | |
glenn@6229 | 1896 | <!--{@idl(Window)}--> |
glenn@6229 | 1897 | |
glenn@6229 | 1898 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 1899 | |
annevk@4900 | 1900 | <h2>Resolved Values</h2> |
annevk@4900 | 1901 | |
annevk@4900 | 1902 | <p><code title="dom-Window-getComputedStyle">getComputedStyle()</code> was |
annevk@4900 | 1903 | historically defined to return the "computed value" of an element or |
annevk@4900 | 1904 | pseudo-element. However, the concept of "computed value" changed between |
annevk@4900 | 1905 | revisions of CSS while the implementation of |
annevk@4900 | 1906 | <code title="dom-Window-getComputedStyle">getComputedStyle()</code> had to |
annevk@4900 | 1907 | remain the same for compatibility with deployed scripts. To address this |
annevk@4900 | 1908 | issue this specification introduces the concept of a |
annevk@4900 | 1909 | <dfn>resolved value</dfn>.</p> |
annevk@4900 | 1910 | |
annevk@4900 | 1911 | <p>The <span>resolved value</span> for a given property can be determined |
annevk@4900 | 1912 | as follows:</p> |
annevk@4900 | 1913 | |
annevk@4900 | 1914 | <dl class="switch"> |
annevk@4900 | 1915 | <!-- |
annevk@4900 | 1916 | We want to treat shorthand properties like any other value basically. |
annevk@4900 | 1917 | |
annevk@4900 | 1918 | <dt>'<code>background</code>' |
annevk@4900 | 1919 | <dt>'<code>border</code>' |
annevk@4900 | 1920 | <dt>'<code>border-collapse</code>' |
annevk@4900 | 1921 | <dt>'<code>border-color</code>' |
annevk@4900 | 1922 | <dt>'<code>border-spacing</code>' |
annevk@4900 | 1923 | <dt>'<code>border-style</code>' |
annevk@4900 | 1924 | <dt>'<code>border-top</code>' |
annevk@4900 | 1925 | <dt>'<code>border-right</code>' |
annevk@4900 | 1926 | <dt>'<code>border-bottom</code>' |
annevk@4900 | 1927 | <dt>'<code>border-left</code>' |
annevk@4900 | 1928 | <dt>'<code>border-width</code>' |
annevk@4900 | 1929 | <dt>'<code>font</code>' |
annevk@4900 | 1930 | <dt>'<code>list-style</code>' |
annevk@4900 | 1931 | <dt>'<code>margin</code>' |
annevk@4900 | 1932 | <dt>'<code>outline</code>' |
annevk@4900 | 1933 | <!- - overflow is not - -> |
annevk@4900 | 1934 | <dt>'<code>padding</code>' |
annevk@4900 | 1935 | <dt>'<code>pause</code>' |
annevk@4900 | 1936 | <dd> |
annevk@4900 | 1937 | <p>There is no <span>resolved value</span>.</p> |
annevk@4900 | 1938 | </dd> |
annevk@4900 | 1939 | --> |
annevk@4900 | 1940 | |
annevk@4900 | 1941 | <dt>'<code>line-height</code>'</dt> |
annevk@4900 | 1942 | <dd><p>The <span>resolved value</span> is the used value.</p></dd> |
annevk@4900 | 1943 | |
annevk@4900 | 1944 | <dt>'<code>height</code>'</dt> |
annevk@4900 | 1945 | <dt>'<code>margin</code>'</dt> |
annevk@4900 | 1946 | <dt>'<code>margin-bottom</code>'</dt> |
annevk@4900 | 1947 | <dt>'<code>margin-left</code>'</dt> |
annevk@4900 | 1948 | <dt>'<code>margin-right</code>'</dt> |
annevk@4900 | 1949 | <dt>'<code>margin-top</code>'</dt> |
annevk@4900 | 1950 | <dt>'<code>padding</code>'</dt> |
annevk@4900 | 1951 | <dt>'<code>padding-bottom</code>'</dt> |
annevk@4900 | 1952 | <dt>'<code>padding-left</code>'</dt> |
annevk@4900 | 1953 | <dt>'<code>padding-right</code>'</dt> |
annevk@4900 | 1954 | <dt>'<code>padding-top</code>'</dt> |
annevk@4900 | 1955 | <dt>'<code>width</code>'</dt> |
annevk@4900 | 1956 | <dd><p>If the property applies to the element or pseudo-element and the |
annevk@4900 | 1957 | <span>resolved value</span> of the '<code>display</code>' property is not |
annevk@4900 | 1958 | <code>none</code>, the <span>resolved value</span> is the |
annevk@4900 | 1959 | <span>used value</span>. Otherwise the <span>resolved value</span> is the |
annevk@4900 | 1960 | computed value.</p></dd> |
annevk@4900 | 1961 | |
glenn@6231 | 1962 | <dt>'<code>bottom</code>'</dt> |
glenn@6231 | 1963 | <dt>'<code>left</code>'</dt> |
glenn@6231 | 1964 | <dt>'<code>right</code>'</dt> |
glenn@6231 | 1965 | <dt>'<code>top</code>'</dt> |
glenn@6231 | 1966 | <dd><p>If the property applies to a positioned element and the |
glenn@6231 | 1967 | <span>resolved value</span> of the '<code>display</code>' property is not |
glenn@6231 | 1968 | <code>none</code>, the <span>resolved value</span> is the |
glenn@6231 | 1969 | <span>used value</span>. Otherwise the <span>resolved value</span> is the |
glenn@6231 | 1970 | computed value.</p></dd> |
glenn@6231 | 1971 | |
annevk@4900 | 1972 | <dt>Any other property</dt> |
annevk@4900 | 1973 | <dd><p>The <span>resolved value</span> is the computed value.</p></dd> |
annevk@4900 | 1974 | </dl> |
annevk@4900 | 1975 | |
glenn@6229 | 1976 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 1977 | |
annevk@4900 | 1978 | <h2 id="iana-considerations">IANA Considerations</h2> |
annevk@4900 | 1979 | |
glenn@6229 | 1980 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1981 | <!-- ........................................................................................................................ --> |
glenn@6229 | 1982 | |
glenn@6229 | 1983 | <h3><dfn title="http-default-style"><code>Default-Style</code></dfn></h3> |
annevk@4900 | 1984 | |
annevk@4900 | 1985 | <p>This section describes a header field for registration in the Permanent |
annevk@4900 | 1986 | Message Header Field Registry. |
annevk@4900 | 1987 | <!--<a href="XXX">[RFC3864]</a>--></p> |
annevk@4900 | 1988 | |
annevk@4900 | 1989 | <dl> |
annevk@4900 | 1990 | <dt>Header field name</dt> |
annevk@4900 | 1991 | <dd>Default-Style</dd> |
annevk@4900 | 1992 | <dt>Applicable protocol</dt> |
annevk@4900 | 1993 | <dd>http</dd> |
annevk@4900 | 1994 | <dt>Status</dt> |
annevk@4900 | 1995 | <dd>standard</dd> |
annevk@4900 | 1996 | <dt>Author/Change controller</dt> |
annevk@4900 | 1997 | <dd>W3C</dd> |
annevk@4900 | 1998 | <dt>Specification document(s)</dt> |
annevk@4900 | 1999 | <dd>This document is the relevant specification.</dd> |
annevk@4900 | 2000 | <dt>Related information</dt> |
annevk@4900 | 2001 | <dd>None.</dd> |
annevk@4900 | 2002 | </dl> |
annevk@4900 | 2003 | |
glenn@6229 | 2004 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6229 | 2005 | |
glenn@6229 | 2006 | <h2 class=no-num>References</h2> |
glenn@6229 | 2007 | |
glenn@6229 | 2008 | <!-- ........................................................................................................................ --> |
glenn@6229 | 2009 | <!-- ........................................................................................................................ --> |
glenn@6229 | 2010 | |
glenn@6229 | 2011 | <h3 class=no-num>Normative references</h3> |
glenn@6229 | 2012 | <div id=anolis-references-normative></div> |
glenn@6229 | 2013 | |
glenn@6229 | 2014 | <!-- ........................................................................................................................ --> |
glenn@6229 | 2015 | <!-- ........................................................................................................................ --> |
glenn@6229 | 2016 | |
glenn@6229 | 2017 | <h3 class=no-num>Informative references</h3> |
glenn@6229 | 2018 | <div id=anolis-references-informative></div> |
glenn@6229 | 2019 | |
glenn@6229 | 2020 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
annevk@4900 | 2021 | |
glenn@6794 | 2022 | <h2 class="no-num" id="changes">Change History</h2> |
glenn@6794 | 2023 | |
glenn@6794 | 2024 | <p>This section documents the primary technical changes of CSSOM related functionality, with a focus on changes to API signatures.</p> |
glenn@6794 | 2025 | |
glenn@6794 | 2026 | <h3 class="no-num" id="changes-from-dom2">Changes From DOM-2 Style</h3> |
glenn@6794 | 2027 | |
glenn@6794 | 2028 | <ul> |
glenn@6794 | 2029 | <li><p>Remove definition of <code>CSSRule.UNKNOWN_RULE</code>, reserving its value (0) to prevent future reuse.</p></li> |
glenn@6794 | 2030 | <li><p>Remove definition of <code>DOMImplementationCSS</code> interface.</p></li> |
glenn@6794 | 2031 | </ul> |
glenn@6794 | 2032 | |
glenn@6794 | 2033 | <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ --> |
glenn@6794 | 2034 | |
annevk@4900 | 2035 | <h2 class="no-num" id="acknowledgments">Acknowledgments</h2> |
annevk@4900 | 2036 | |
glenn@4922 | 2037 | <p>The editors would like to thank |
annevk@4900 | 2038 | |
annevk@4900 | 2039 | Alexey Feldgendler, |
annevk@4904 | 2040 | Björn Höhrmann, |
glenn@6794 | 2041 | Boris Zbasky, |
annevk@4913 | 2042 | Brian Kardell, |
annevk@4900 | 2043 | Christian Krebs, |
annevk@4900 | 2044 | Daniel Glazman, |
annevk@4900 | 2045 | David Baron, |
annevk@4900 | 2046 | <i>fantasai</i>, |
annevk@4900 | 2047 | Hallvord R. M. Steen, |
annevk@4900 | 2048 | Ian Hickson, |
annevk@4920 | 2049 | John Daggett, |
annevk@4900 | 2050 | Lachlan Hunt, |
annevk@4900 | 2051 | Morten Stenshorne, |
annevk@4900 | 2052 | Philip Taylor, |
annevk@4900 | 2053 | Robert O'Callahan, |
annevk@4900 | 2054 | Sjoerd Visscher, |
annevk@4900 | 2055 | Simon Pieters, |
annevk@4912 | 2056 | Sylvain Galineau, |
annevk@4912 | 2057 | Tarquin Wilton-Jones, and |
annevk@4912 | 2058 | Zack Weinberg |
annevk@4900 | 2059 | |
annevk@4900 | 2060 | for contributing to this specification.</p> |
annevk@4900 | 2061 | |
glenn@4922 | 2062 | <p>Additional thanks to Ian Hickson for writing the |
annevk@4900 | 2063 | initial version of the alternative style sheets API and canonicalization |
annevk@4900 | 2064 | (now serialization) rules for CSS values.</p> |
annevk@4900 | 2065 | |
annevk@4900 | 2066 | <!-- XXX NOTES |
annevk@4900 | 2067 | |
annevk@4900 | 2068 | <style type=text/css;charset=utf-8> does create a StyleSheet in Firefox |
annevk@4900 | 2069 | and Opera, but does not create a StyleSheet in IE. I prefer IE. |
annevk@4900 | 2070 | |
annevk@4900 | 2071 | <style type=TEXT/CSS> sets the style sheet type to text/css in Firefox and |
annevk@4900 | 2072 | TEXT/CSS in Opera and IE. I prefer Firefox. |
annevk@4900 | 2073 | |
annevk@4900 | 2074 | <style> sets the style sheet location to the document location Firefox, |
annevk@4900 | 2075 | the empty string in IE, and null in Opera. I prefer Opera |
annevk@4900 | 2076 | |
annevk@4900 | 2077 | <style media="x"> invokes .sheet.media.mediaText = "x" |
annevk@4900 | 2078 | |
glenn@6229 | 2079 | <style> does not "have" a title |
annevk@4900 | 2080 | |
annevk@4900 | 2081 | .cascadedStyle that returns less keywords than currentStyle, no inherit, |
annevk@4900 | 2082 | etc. |
annevk@4900 | 2083 | |
annevk@4900 | 2084 | Markup style: http://krijnhoetmer.nl/irc-logs/whatwg/20100204#l-529 |
annevk@4900 | 2085 | --> |
annevk@4900 | 2086 | </body> |
annevk@4900 | 2087 | </html> |
annevk@4900 | 2088 |