1.1 --- a/masking/index.html Sat Mar 09 21:21:02 2013 -0800
1.2 +++ b/masking/index.html Sun Mar 10 19:35:27 2013 -0700
1.3 @@ -11,7 +11,7 @@
1.4 rel=dcterms.rights>
1.5 <meta content="CSS Masking" name=dcterms.title>
1.6 <meta content=text name=dcterms.type>
1.7 - <meta content=2013-03-10 name=dcterms.issued>
1.8 + <meta content=2013-03-11 name=dcterms.issued>
1.9 <meta
1.10 content="http://dvcs.w3.org/hg/FXTF/raw-file/default/masking/index.html"
1.11 name=dcterms.creator>
1.12 @@ -34,14 +34,14 @@
1.13
1.14 <h1>CSS Masking</h1>
1.15
1.16 - <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 10 March 2013</h2>
1.17 + <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 11 March 2013</h2>
1.18
1.19 <dl>
1.20 <dt>This version:
1.21
1.22 <dd><a
1.23 href="http://dvcs.w3.org/hg/FXTF/raw-file/default/masking/index.html">http://dvcs.w3.org/hg/FXTF/raw-file/default/masking/index.html</a>
1.24 - <!--http://www.w3.org/TR/2013/WD-css-masking-20130310/-->
1.25 + <!--http://www.w3.org/TR/2013/WD-css-masking-20130311/-->
1.26
1.27 <dt>Latest version:
1.28
1.29 @@ -264,6 +264,24 @@
1.30 </span>Interface SVGMaskElement</a>
1.31 </ul>
1.32
1.33 + <li><a href="#conformance"><span class=secno>11. </span> Conformance</a>
1.34 + <ul class=toc>
1.35 + <li><a href="#conventions"><span class=secno>11.1. </span> Document
1.36 + conventions</a>
1.37 +
1.38 + <li><a href="#conformance-classes"><span class=secno>11.2. </span>
1.39 + Conformance classes</a>
1.40 +
1.41 + <li><a href="#partial"><span class=secno>11.3. </span> Partial
1.42 + implementations</a>
1.43 +
1.44 + <li><a href="#experimental"><span class=secno>11.4. </span> Experimental
1.45 + implementations</a>
1.46 +
1.47 + <li><a href="#testing"><span class=secno>11.5. </span> Non-experimental
1.48 + implementations</a>
1.49 + </ul>
1.50 +
1.51 <li class=no-num><a href="#references"> References</a>
1.52 <ul class=toc>
1.53 <li class=no-num><a href="#normative-references"> Normative
1.54 @@ -388,17 +406,17 @@
1.55 <p> Some property and element definitions in this specification require an
1.56 SVG 1.1 implementation <a href="#SVG11"
1.57 rel=biblioentry>[SVG11]<!--{{!SVG11}}--></a>. UAs without support for SVG
1.58 - must not implement the ‘<a href="#mask-type"><code
1.59 - class=property>mask-type</code></a>’ and ‘<a href="#clip-rule"><code
1.60 - class=property>clip-rule</code></a>’ properties as well as the <a
1.61 - class=element-name href="#MaskElement">‘<code
1.62 - class=property>mask</code>’</a> and <a class=element-name
1.63 - href="#ClipPathElement">‘<code class=property>clipPath</code>’</a>
1.64 - elements. Furthermore, the ‘<a href="#mask"><code
1.65 + must not implement any of the following properties and elements: ‘<a
1.66 + href="#mask-type"><code class=property>mask-type</code></a>’, ‘<a
1.67 + href="#clip-rule"><code class=property>clip-rule</code></a>’, <a
1.68 + class=element-name href="#ClipPathElement">‘<code
1.69 + class=property>clipPath</code>’</a> element, <a class=element-name
1.70 + href="#MaskElement">‘<code class=property>mask</code>’</a> element.
1.71 + For UAs without support for SVG, the ‘<a href="#mask"><code
1.72 class=property>mask</code></a>’ and ‘<a href="#clip-path"><code
1.73 - class=property>clip-path</code></a>’ properties must not support
1.74 + class=property>clip-path</code></a>’ properties must neither support
1.75 references to <a class=element-name href="#MaskElement">‘<code
1.76 - class=property>mask</code>’</a> and <a class=element-name
1.77 + class=property>mask</code>’</a> elements nor to <a class=element-name
1.78 href="#ClipPathElement">‘<code class=property>clipPath</code>’</a>
1.79 elements.
1.80
1.81 @@ -430,7 +448,7 @@
1.82 <dd>
1.83 <p> The union of all border boxes for the element that has an associated
1.84 CSS layout box and is not in the <code>http://www.w3.org/2000/svg</code>
1.85 - namespace and it's descendant elements. Or the object bounding box <a
1.86 + namespace and its descendant elements. Or the object bounding box <a
1.87 href="#SVG11" rel=biblioentry>[SVG11]<!--{{!SVG11}}--></a>, if the
1.88 element does not have an associated CSS layout box and is in the
1.89 <code>http://www.w3.org/2000/svg</code> namespace (See <a
1.90 @@ -464,8 +482,9 @@
1.91 <dt id=TermUserCoordinateSystem><dfn id=user-coordinate-system>user
1.92 coordinate system</dfn>
1.93
1.94 - <dd> See definition of <a class=term href="#local-coordinate-system">local
1.95 - coordinate system</a>.
1.96 + <dd> The term <a href="#user-coordinate-system"><var>user coordinate
1.97 + system</var></a> is equivalent to the term <a
1.98 + href="#local-coordinate-system"><var>local coordinate system</var></a>.
1.99
1.100 <dt id=TermObjectBoundingBoxUnits><dfn id=object-bounding-box-units>object
1.101 bounding box units</dfn>
1.102 @@ -511,15 +530,14 @@
1.103 class=property>clip-path</code></a>’, ‘<a href="#mask"><code
1.104 class=property>mask</code></a>’ or ‘<a href="#mask-image"><code
1.105 class=property>mask-image</code></a>’ properties to an element formatted
1.106 - with the CSS box model establishes a stacking context the same way that
1.107 + with the CSS box model establishes a stacking context in the same way that
1.108 CSS ‘<code class=property>opacity</code>’ does, and all the element's
1.109 descendants are rendered together as a group with the masking applied to
1.110 the group as a whole.
1.111
1.112 <p> The ‘<a href="#mask"><code class=property>mask</code></a>’ and
1.113 ‘<a href="#mask-image"><code class=property>mask-image</code></a>’
1.114 - properties have no effect on the geometry of the target element's CSS
1.115 - boxes.
1.116 + properties have no effect on the geometry of any element's CSS boxes.
1.117
1.118 <p> The compositing model follows the SVG compositing model <a
1.119 href="#SVG11" rel=biblioentry>[SVG11]<!--{{!SVG11}}--></a>: first any
1.120 @@ -2084,11 +2102,11 @@
1.121 </dl>
1.122 </div>
1.123
1.124 - <p class=note>Note that if at least one of the attributes <a
1.125 - class=attr-name href="#MaskElementXAttribute">‘<code
1.126 - class=property>x</code>’</a>, <a class=attr-name
1.127 - href="#MaskElementYAttribute">‘<code class=property>y</code>’</a>, <a
1.128 - class=attr-name href="#MaskElementWidthAttribute">‘<code
1.129 + <p>If at least one of the attributes <a class=attr-name
1.130 + href="#MaskElementXAttribute">‘<code class=property>x</code>’</a>, <a
1.131 + class=attr-name href="#MaskElementYAttribute">‘<code
1.132 + class=property>y</code>’</a>, <a class=attr-name
1.133 + href="#MaskElementWidthAttribute">‘<code
1.134 class=property>width</code>’</a> or <a class=attr-name
1.135 href="#MaskElementHeightAttribute">‘<code
1.136 class=property>height</code>’</a> are specified, the given object and
1.137 @@ -3367,40 +3385,38 @@
1.138 property on the elements which establish a new viewport. (See <a
1.139 href="#SVG11" rel=biblioentry>[SVG11]<!--{{SVG11}}--></a>)
1.140
1.141 - <div class=note>
1.142 - <p>A couple of notes:
1.143 -
1.144 - <ul>
1.145 - <li>The <a class=element-name href="#ClipPathElement">‘<code
1.146 - class=property>clipPath</code>’</a> element itself and its child
1.147 - elements do <em>not</em> inherit clipping paths from the ancestors of
1.148 - the <a class=element-name href="#ClipPathElement">‘<code
1.149 - class=property>clipPath</code>’</a> element.
1.150 -
1.151 - <li>The <a class=element-name href="#ClipPathElement">‘<code
1.152 - class=property>clipPath</code>’</a> element or any of its children can
1.153 - specify property ‘<a href="#clip-path"><code
1.154 - class=property>clip-path</code></a>’.<br>
1.155 - If a valid ‘<a href="#clip-path"><code
1.156 - class=property>clip-path</code></a>’ reference is placed on a <a
1.157 - class=element-name href="#ClipPathElement">‘<code
1.158 - class=property>clipPath</code>’</a> element, the resulting clipping
1.159 - path is the intersection of the contents of the <a class=element-name
1.160 - href="#ClipPathElement">‘<code class=property>clipPath</code>’</a>
1.161 - element with the referenced clipping path.<br>
1.162 - If a valid ‘<a href="#clip-path"><code
1.163 - class=property>clip-path</code></a>’ reference is placed on one of the
1.164 - children of a <a class=element-name href="#ClipPathElement">‘<code
1.165 - class=property>clipPath</code>’</a> element, then the given child
1.166 - element is clipped by the referenced clipping path before OR'ing the
1.167 - silhouette of the child element with the silhouettes of the other child
1.168 - elements.
1.169 -
1.170 - <li>An empty clipping path will completely clip away the element that had
1.171 - the ‘<a href="#clip-path"><code class=property>clip-path</code></a>’
1.172 - property applied.
1.173 - </ul>
1.174 - </div>
1.175 + <p>A couple of additions:
1.176 +
1.177 + <ul>
1.178 + <li>The <a class=element-name href="#ClipPathElement">‘<code
1.179 + class=property>clipPath</code>’</a> element itself and its child
1.180 + elements do <em>not</em> inherit clipping paths from the ancestors of the
1.181 + <a class=element-name href="#ClipPathElement">‘<code
1.182 + class=property>clipPath</code>’</a> element.
1.183 +
1.184 + <li>The <a class=element-name href="#ClipPathElement">‘<code
1.185 + class=property>clipPath</code>’</a> element or any of its children can
1.186 + specify property ‘<a href="#clip-path"><code
1.187 + class=property>clip-path</code></a>’.<br>
1.188 + If a valid ‘<a href="#clip-path"><code
1.189 + class=property>clip-path</code></a>’ reference is placed on a <a
1.190 + class=element-name href="#ClipPathElement">‘<code
1.191 + class=property>clipPath</code>’</a> element, the resulting clipping
1.192 + path is the intersection of the contents of the <a class=element-name
1.193 + href="#ClipPathElement">‘<code class=property>clipPath</code>’</a>
1.194 + element with the referenced clipping path.<br>
1.195 + If a valid ‘<a href="#clip-path"><code
1.196 + class=property>clip-path</code></a>’ reference is placed on one of the
1.197 + children of a <a class=element-name href="#ClipPathElement">‘<code
1.198 + class=property>clipPath</code>’</a> element, then the given child
1.199 + element is clipped by the referenced clipping path before OR'ing the
1.200 + silhouette of the child element with the silhouettes of the other child
1.201 + elements.
1.202 +
1.203 + <li>An empty clipping path will completely clip away the element that had
1.204 + the ‘<a href="#clip-path"><code class=property>clip-path</code></a>’
1.205 + property applied.
1.206 + </ul>
1.207
1.208 <h3 id=clipPath-geometry><span class=secno>8.5. </span>Clipping paths,
1.209 geometry, and pointer events</h3>
1.210 @@ -3620,6 +3636,127 @@
1.211 </dl>
1.212 </dl>
1.213
1.214 + <h2 id=conformance><span class=secno>11. </span> Conformance</h2>
1.215 +
1.216 + <h3 id=conventions><span class=secno>11.1. </span> Document conventions</h3>
1.217 +
1.218 + <p>Conformance requirements are expressed with a combination of descriptive
1.219 + assertions and RFC 2119 terminology. The key words “MUST”, “MUST
1.220 + NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
1.221 + “SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in the
1.222 + normative parts of this document are to be interpreted as described in RFC
1.223 + 2119. However, for readability, these words do not appear in all uppercase
1.224 + letters in this specification.
1.225 +
1.226 + <p>All of the text of this specification is normative except sections
1.227 + explicitly marked as non-normative, examples, and notes. <a
1.228 + href="#RFC2119" rel=biblioentry>[RFC2119]<!--{{!RFC2119}}--></a>
1.229 +
1.230 + <p>Examples in this specification are introduced with the words “for
1.231 + example” or are set apart from the normative text with
1.232 + <code>class="example"</code>, like this:
1.233 +
1.234 + <div class=example>
1.235 + <p>This is an example of an informative example.
1.236 + </div>
1.237 +
1.238 + <p>Informative notes begin with the word “Note” and are set apart from
1.239 + the normative text with <code>class="note"</code>, like this:
1.240 +
1.241 + <p class=note>Note, this is an informative note.
1.242 +
1.243 + <h3 id=conformance-classes><span class=secno>11.2. </span> Conformance
1.244 + classes</h3>
1.245 +
1.246 + <p>Conformance to CSS Masking is defined for three conformance classes:
1.247 +
1.248 + <dl>
1.249 + <dt><dfn id=style-sheet title="style sheet!!as conformance class">style
1.250 + sheet</dfn>
1.251 +
1.252 + <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#style-sheet">CSS
1.253 + style sheet</a>.
1.254 +
1.255 + <dt><dfn id=renderer>renderer</dfn>
1.256 +
1.257 + <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">UA</a>
1.258 + that interprets the semantics of a style sheet and renders documents that
1.259 + use them.
1.260 +
1.261 + <dt><dfn id=authoring-tool>authoring tool</dfn>
1.262 +
1.263 + <dd>A <a href="http://www.w3.org/TR/CSS21/conform.html#user-agent">UA</a>
1.264 + that writes a style sheet.
1.265 + </dl>
1.266 +
1.267 + <p>A style sheet is conformant to CSS Masking if all of its statements that
1.268 + use syntax defined in this module are valid according to the generic CSS
1.269 + grammar and the individual grammars of each feature defined in this
1.270 + module.
1.271 +
1.272 + <p>A renderer is conformant to CSS Masking if, in addition to interpreting
1.273 + the style sheet as defined by the appropriate specifications, it supports
1.274 + all the features defined by CSS Masking by parsing them correctly and
1.275 + rendering the document accordingly. However, the inability of a UA to
1.276 + correctly render a document due to limitations of the device does not make
1.277 + the UA non-conformant. (For example, a UA is not required to render color
1.278 + on a monochrome monitor.)
1.279 +
1.280 + <p>An authoring tool is conformant to CSS Masking if it writes style sheets
1.281 + that are syntactically correct according to the generic CSS grammar and
1.282 + the individual grammars of each feature in this module, and meet all other
1.283 + conformance requirements of style sheets as described in this module.
1.284 +
1.285 + <h3 id=partial><span class=secno>11.3. </span> Partial implementations</h3>
1.286 +
1.287 + <p>So that authors can exploit the forward-compatible parsing rules to
1.288 + assign fallback values, CSS renderers <strong>must</strong> treat as
1.289 + invalid (and <a
1.290 + href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignore as
1.291 + appropriate</a>) any at-rules, properties, property values, keywords, and
1.292 + other syntactic constructs for which they have no usable level of support.
1.293 + In particular, user agents <strong>must not</strong> selectively ignore
1.294 + unsupported component values and honor supported values in a single
1.295 + multi-value property declaration: if any value is considered invalid (as
1.296 + unsupported values must be), CSS requires that the entire declaration be
1.297 + ignored.
1.298 +
1.299 + <h3 id=experimental><span class=secno>11.4. </span> Experimental
1.300 + implementations</h3>
1.301 +
1.302 + <p>To avoid clashes with future CSS features, the CSS2.1 specification
1.303 + reserves a <a
1.304 + href="http://www.w3.org/TR/CSS21/syndata.html#vendor-keywords">prefixed
1.305 + syntax</a> for proprietary and experimental extensions to CSS.
1.306 +
1.307 + <p>Prior to a specification reaching the Candidate Recommendation stage in
1.308 + the W3C process, all implementations of a CSS feature are considered
1.309 + experimental. The CSS Working Group recommends that implementations use a
1.310 + vendor-prefixed syntax for such features, including those in W3C Working
1.311 + Drafts. This avoids incompatibilities with future changes in the draft.
1.312 +
1.313 + <h3 id=testing><span class=secno>11.5. </span> Non-experimental
1.314 + implementations</h3>
1.315 +
1.316 + <p>Once a specification reaches the Candidate Recommendation stage,
1.317 + non-experimental implementations are possible, and implementors should
1.318 + release an unprefixed implementation of any CR-level feature they can
1.319 + demonstrate to be correctly implemented according to spec.
1.320 +
1.321 + <p>To establish and maintain the interoperability of CSS across
1.322 + implementations, the CSS Working Group requests that non-experimental CSS
1.323 + renderers submit an implementation report (and, if necessary, the
1.324 + testcases used for that implementation report) to the W3C before releasing
1.325 + an unprefixed implementation of any CSS features. Testcases submitted to
1.326 + W3C are subject to review and correction by the CSS Working Group.
1.327 +
1.328 + <p>Further information on submitting testcases and implementation reports
1.329 + can be found from on the CSS Working Group's website at <a
1.330 + href="http://www.w3.org/Style/CSS/Test/">http://www.w3.org/Style/CSS/Test/</a>.
1.331 + Questions should be directed to the <a
1.332 + href="http://lists.w3.org/Archives/Public/public-css-testsuite">public-css-testsuite@w3.org</a>
1.333 + mailing list.
1.334 +
1.335 <h2 class=no-num id=references> References</h2>
1.336
1.337 <h3 class=no-num id=normative-references> Normative references</h3>
1.338 @@ -3699,6 +3836,15 @@
1.339 </dd>
1.340 <!---->
1.341
1.342 + <dt id=RFC2119>[RFC2119]
1.343 +
1.344 + <dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key
1.345 + words for use in RFCs to Indicate Requirement Levels.</cite></a> Internet
1.346 + RFC 2119. URL: <a
1.347 + href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
1.348 + </dd>
1.349 + <!---->
1.350 +
1.351 <dt id=SELECTORS4>[SELECTORS4]
1.352
1.353 <dd>Elika J. Etemad. <a
1.354 @@ -3768,6 +3914,9 @@
1.355 <li>‘<a href="#alpha"><code class=css>alpha</code></a>’, <a
1.356 href="#alpha" title="section 6.2."><strong>6.2.</strong></a>
1.357
1.358 + <li>authoring tool, <a href="#authoring-tool"
1.359 + title="section 11.2."><strong>11.2.</strong></a>
1.360 +
1.361 <li>‘<a href="#auto"><code class=css>auto</code></a>’, <a href="#auto"
1.362 title="section 6.2."><strong>6.2.</strong></a>
1.363
1.364 @@ -3954,6 +4103,9 @@
1.365 <li><a href="#ltpositiongt"><var><position></var></a>, <a
1.366 href="#ltpositiongt" title="section 6.4."><strong>6.4.</strong></a>
1.367
1.368 + <li>renderer, <a href="#renderer"
1.369 + title="section 11.2."><strong>11.2.</strong></a>
1.370 +
1.371 <li><a href="#ltrepeat-stylegt"><var><repeat-style></var></a>, <a
1.372 href="#ltrepeat-stylegt" title="section 6.3."><strong>6.3.</strong></a>
1.373
1.374 @@ -3966,6 +4118,12 @@
1.375 <li><a href="#ltsource-typegt"><var><source-type></var></a>, <a
1.376 href="#ltsource-typegt" title="section 6.2."><strong>6.2.</strong></a>
1.377
1.378 + <li>style sheet
1.379 + <ul>
1.380 + <li>as conformance class, <a href="#style-sheet"
1.381 + title="section 11.2."><strong>11.2.</strong></a>
1.382 + </ul>
1.383 +
1.384 <li><top>, <a href="#lttopgt"
1.385 title="section 8.3."><strong>8.3.</strong></a>
1.386
