- From: Tab Atkins Jr.. via cvs-syncmail <cvsmail@w3.org>
- Date: Tue, 15 Nov 2011 23:58:10 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-images In directory hutz:/tmp/cvs-serv18460 Modified Files: Overview.html Overview.src.html Added Files: element-function.png Log Message: Add an example of the 'normal case' for element(). Index: Overview.html =================================================================== RCS file: /sources/public/csswg/css3-images/Overview.html,v retrieving revision 1.220 retrieving revision 1.221 diff -u -d -r1.220 -r1.221 --- Overview.html 15 Nov 2011 23:42:35 -0000 1.220 +++ Overview.html 15 Nov 2011 23:58:08 -0000 1.221 @@ -759,9 +759,17 @@ visual effects).</p> <div class=example> - <p class=issue>Steal one of the MozHacks examples, once I get permission - to do so.</p> - </div> + <p>As a somewhat silly example, a <p> element can be reused as a + background elsewhere in the document:</p> + + <pre> +<style> +#src { color: white; background: lime; width: 300px; height: 40px; } +#dst { color: black; background: element(#src); padding: 20px; margin: 20px 0; } +</style> +<p id='src'>I'm an ordinary element!</p> +<p id='dst'>I'm using the previous element as my background!</p></pre> + <img alt="" src=element-function.png></div> </dl> <p>Implementations may either re-use existing bitmap data generated for the @@ -2163,7 +2171,7 @@ rotational correction to perform. The ‘<a href="#image-orientation0"><code class=property>image-orientation</code></a>’ property provides a way - to specify an "out-of-band" rotation to be applied to image source data to + to apply an ”out-of-band“ rotation to image source data to correctly orient an image. <p class=note>Note this facility is not intended to specify layout @@ -2235,6 +2243,10 @@ rounded to -90deg), then moduloing the value by 1 turn (360deg, 400grad, etc.). + <p class=note>Note that in CSS, orientation data encoded in the image (e.g. + EXIF data) is ignored. <span class=issue>Is this an issue? What do + printers do?</span> + <div class=example> <p>The following example rotates the image 90 degrees clockwise:</p> --- NEW FILE: element-function.png --- (This appears to be a binary file; contents omitted.) Index: Overview.src.html =================================================================== RCS file: /sources/public/csswg/css3-images/Overview.src.html,v retrieving revision 1.228 retrieving revision 1.229 diff -u -d -r1.228 -r1.229 --- Overview.src.html 15 Nov 2011 23:42:35 -0000 1.228 +++ Overview.src.html 15 Nov 2011 23:58:08 -0000 1.229 @@ -413,7 +413,17 @@ <p>If the referenced element has a transform applied to it or an ancestor, the transform must be ignored when rendering the element as an image. If the referenced element is broken across pages, the element must be displayed as if the page content areas were joined flush in the pagination direction (elements broken across lines or columns just render with their bounding box, as normal, which may have unintended visual effects).</p> <div class='example'> - <p class='issue'>Steal one of the MozHacks examples, once I get permission to do so.</p> + <p>As a somewhat silly example, a <p> element can be reused as a background elsewhere in the document:</p> + + <pre> +<style> +#src { color: white; background: lime; width: 300px; height: 40px; } +#dst { color: black; background: element(#src); padding: 20px; margin: 20px 0; } +</style> +<p id='src'>I'm an ordinary element!</p> +<p id='dst'>I'm using the previous element as my background!</p></pre> + + <img src="element-function.png" alt=""> </div> </dd> </dl>
Received on Tuesday, 15 November 2011 23:58:15 UTC