- From: Tab Atkins Jr.. via cvs-syncmail <cvsmail@w3.org>
- Date: Fri, 11 Nov 2011 16:53:23 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-background In directory hutz:/tmp/cvs-serv17176 Modified Files: Overview.html Overview.src.html Log Message: Fixed a few lingering instances of <bg-position> to just <position> Index: Overview.html =================================================================== RCS file: /sources/public/csswg/css3-background/Overview.html,v retrieving revision 1.249 retrieving revision 1.250 diff -u -d -r1.249 -r1.250 --- Overview.html 28 Sep 2011 23:07:13 -0000 1.249 +++ Overview.html 11 Nov 2011 16:53:21 -0000 1.250 @@ -22,13 +22,13 @@ <h1>CSS Backgrounds and Borders Module Level 3</h1> - <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 28 September + <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 11 November 2011</h2> <dl> <dt>This version: - <dd><!-- <a href="http://www.w3.org/TR/2011/CR-css3-background-20110928">http://www.w3.org/TR/2011/ED-css3-background-20110928/</a> --> + <dd><!-- <a href="http://www.w3.org/TR/2011/CR-css3-background-20111111">http://www.w3.org/TR/2011/ED-css3-background-20111111/</a> --> <a href="http://dev.w3.org/csswg/css3-background">http://dev.w3.org/csswg/css3-background</a> @@ -60,13 +60,13 @@ <p class=copyright><a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright" rel=license>Copyright</a> © 2011 <a - href="http://www.w3.org/"><acronym title="World Wide Web - Consortium">W3C</acronym></a><sup>®</sup> (<a - href="http://www.csail.mit.edu/"><acronym title="Massachusetts Institute - of Technology">MIT</acronym></a>, <a href="http://www.ercim.eu/"><acronym - title="European Research Consortium for Informatics and - Mathematics">ERCIM</acronym></a>, <a - href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a + href="http://www.w3.org/"><acronym + title="World Wide Web Consortium">W3C</acronym></a><sup>®</sup> (<a + href="http://www.csail.mit.edu/"><acronym + title="Massachusetts Institute of Technology">MIT</acronym></a>, <a + href="http://www.ercim.eu/"><acronym + title="European Research Consortium for Informatics and Mathematics">ERCIM</acronym></a>, + <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>, <a href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a> @@ -326,8 +326,9 @@ background and border.) <div class=figure> - <p><img alt="Diagram of a typical box, showing the content, padding, - border and margin areas" src=box> + <p><img + alt="Diagram of a typical box, showing the content, padding, border and margin areas" + src=box> <p class=caption>The various areas and edges of a typical box. (This diagram is explained in the CSS2.1 Box Model chapter <a href="#CSS21" @@ -562,15 +563,15 @@ drawn with the first specified one on top (closest to the user) and each subsequent image behind the previous one. Where - <pre - class=prod><dfn id=ltbg-imagegt><var><bg-image></var></dfn> = <a href="#ltimagegt"><var><image></var></a> | none</pre> + <pre class=prod><dfn id=ltbg-imagegt><var><bg-image></var></dfn> = <a + href="#ltimagegt"><var><image></var></a> | none</pre> - <p>A value of <dfn id=none title="''none''!!'background-image' - value">‘<code class=css>none</code>’</dfn> counts as an image - layer but draws nothing. An image that is empty (zero width or zero - height), that fails to download, or that cannot be displayed (e.g., - because it is not in a supported image format) likewise counts as a layer - but draws nothing. + <p>A value of <dfn id=none + title="''none''!!'background-image' value">‘<code + class=css>none</code>’</dfn> counts as an image layer but draws + nothing. An image that is empty (zero width or zero height), that fails to + download, or that cannot be displayed (e.g., because it is not in a + supported image format) likewise counts as a layer but draws nothing. <p>See the section <a href="#layering">“Layering multiple background images”</a> for how ‘<a href="#background-image"><code @@ -670,8 +671,8 @@ href="#the-background-size">sized</a> and <a href="#the-background-position">positioned</a>. Where - <pre - class=prod><dfn id=ltrepeat-stylegt><var><repeat-style></var></dfn> = repeat-x | repeat-y | [repeat | space | round | no-repeat]{1,2}</pre> + <pre class=prod><dfn + id=ltrepeat-stylegt><var><repeat-style></var></dfn> = repeat-x | repeat-y | [repeat | space | round | no-repeat]{1,2}</pre> <p>Single values for <a href="#ltrepeat-stylegt"><var><repeat-style></var></a> have the @@ -709,15 +710,17 @@ second for the vertical one, as follows: <dl> - <dt><dfn id=repeat title="''repeat''!!'background-repeat' - value">‘<code class=css>repeat</code>’</dfn> + <dt><dfn id=repeat + title="''repeat''!!'background-repeat' value">‘<code + class=css>repeat</code>’</dfn> <dd> The image is repeated in this direction as often as needed to cover the <a class=index href="#background-painting-area" id=background-painting-area0>background painting area</a>. - <dt><dfn id=space title="''space''!!'background-repeat' - value">‘<code class=css>space</code>’</dfn> + <dt><dfn id=space + title="''space''!!'background-repeat' value">‘<code + class=css>space</code>’</dfn> <dd> The image is repeated as often as will fit within the <a class=index href="#background-positioning-area" @@ -735,8 +738,9 @@ class=property>background-position</code></a>’ determines its position in this direction. - <dt><dfn id=round title="''round''!!'background-repeat' - value">‘<code class=css>round</code>’</dfn> + <dt><dfn id=round + title="''round''!!'background-repeat' value">‘<code + class=css>round</code>’</dfn> <dd> The image is repeated as often as will fit within the <a class=index href="#background-positioning-area" @@ -748,8 +752,9 @@ painting area</a> is larger than the background positioning area, then the pattern repeats to fill the background painting area. - <dt><dfn id=no-repeat title="''no-repeat''!!'background-repeat' - value">‘<code class=css>no-repeat</code>’</dfn> + <dt><dfn id=no-repeat + title="''no-repeat''!!'background-repeat' value">‘<code + class=css>no-repeat</code>’</dfn> <dd> The image is placed once and not repeated in this direction. </dl> @@ -770,8 +775,8 @@ </pre> <div class=figure> - <p><img alt="A centered background image, with copies repeated up and - down the border, padding and content areas." + <p><img + alt="A centered background image, with copies repeated up and down the border, padding and content areas." src=bg-repeat><!--<SPAN class="dlink"> <A name="img-bg-repeat" href="images/longdesc/bg-repeat-desc.html" title="Long description for background pattern">[D]</A></SPAN>--> @@ -866,8 +871,8 @@ value is given as a comma-separated list of <attachment> keywords where - <pre - class=prod><dfn id=ltattachmentgt><var><attachment></var></dfn> = scroll | fixed | local</pre> + <pre class=prod><dfn + id=ltattachmentgt><var><attachment></var></dfn> = scroll | fixed | local</pre> <dl> <dt><dfn id=fixed0>fixed</dfn> @@ -1104,29 +1109,33 @@ position if one or two values are given, otherwise specifies the top edge as the origin for the next offset. - <dt><dfn id=right title="''right''!!'background-position' - value">‘<code class=css>right</code>’</dfn> + <dt><dfn id=right + title="''right''!!'background-position' value">‘<code + class=css>right</code>’</dfn> <dd>Equivalent to ‘<code class=css>100%</code>’ for the horizontal position if one or two values are given, otherwise specifies the right edge as the origin for the next offset. - <dt><dfn id=bottom title="''bottom''!!'background-position' - value">‘<code class=css>bottom</code>’</dfn> + <dt><dfn id=bottom + title="''bottom''!!'background-position' value">‘<code + class=css>bottom</code>’</dfn> <dd>Equivalent to ‘<code class=css>100%</code>’ for the vertical position if one or two values are given, otherwise specifies the bottom edge as the origin for the next offset. - <dt><dfn id=left title="''left''!!'background-position' - value">‘<code class=css>left</code>’</dfn> + <dt><dfn id=left + title="''left''!!'background-position' value">‘<code + class=css>left</code>’</dfn> <dd>Equivalent to ‘<code class=css>0%</code>’ for the horizontal position if one or two values are given, otherwise specifies the left edge as the origin for the next offset. - <dt><dfn id=center title="''center''!!'background-position' - value">‘<code class=css>center</code>’</dfn> + <dt><dfn id=center + title="''center''!!'background-position' value">‘<code + class=css>center</code>’</dfn> <dd>Equivalent to ‘<code class=css>50%</code>’ (‘<code class=css>left 50%</code>’) for the horizontal position if the @@ -1229,8 +1238,8 @@ <p>Determines the <dfn id=background-painting-area>background painting area</dfn>. The syntax of the property is given with - <pre - class=prod><dfn id=ltboxgt><var><box></var></dfn> = border-box | padding-box | content-box</pre> + <pre class=prod><dfn + id=ltboxgt><var><box></var></dfn> = border-box | padding-box | content-box</pre> <p>Values have the following meanings: @@ -1328,8 +1337,9 @@ determine the background positioning area(s). <dl> - <dt><dfn id=padding-box0 title="''padding-box''!!'background-origin' - value"> ‘<code class=css>padding-box</code>’</dfn> + <dt><dfn id=padding-box0 + title="''padding-box''!!'background-origin' value"> ‘<code + class=css>padding-box</code>’</dfn> <dd>The position is relative to the padding box. (For single boxes ‘<code class=css>0 0</code>’ is the upper left corner of the @@ -1424,8 +1434,8 @@ <p>Specifies the size of the background images. Where - <pre - class=prod><dfn id=ltbg-sizegt><var><bg-size></var></dfn> = [ <var><length></var> | <var><percentage></var> | auto ]{1,2} | cover | contain</pre> + <pre class=prod><dfn + id=ltbg-sizegt><var><bg-size></var></dfn> = [ <var><length></var> | <var><percentage></var> | auto ]{1,2} | cover | contain</pre> <p>Values have the following meanings: @@ -1664,11 +1674,22 @@ <p>Where - <pre - class=prod><dfn id=ltbg-layergt><var><bg-layer></var></dfn> = <a href="#ltbg-imagegt"><var><bg-image></var></a> || <var><bg-position></var> [ / <a href="#ltbg-sizegt"><var><bg-size></var></a> ]? || <a href="#ltrepeat-stylegt"><var><repeat-style></var></a> || <a href="#ltattachmentgt"><var><attachment></var></a> || <a href="#ltboxgt"><var><box></var></a>{1,2} </pre> + <pre class=prod><dfn id=ltbg-layergt><var><bg-layer></var></dfn> = <a + href="#ltbg-imagegt"><var><bg-image></var></a> || <a + href="#ltpositiongt"><var><position></var></a> [ / <a + href="#ltbg-sizegt"><var><bg-size></var></a> ]? || <a + href="#ltrepeat-stylegt"><var><repeat-style></var></a> || <a + href="#ltattachmentgt"><var><attachment></var></a> || <a + href="#ltboxgt"><var><box></var></a>{1,2} </pre> - <pre - class=prod><dfn id=ltfinal-bg-layergt><var><final-bg-layer></var></dfn> = <a href="#ltbg-imagegt"><var><bg-image></var></a> || <var><bg-position></var> [ / <a href="#ltbg-sizegt"><var><bg-size></var></a> ]? || <a href="#ltrepeat-stylegt"><var><repeat-style></var></a> || <a href="#ltattachmentgt"><var><attachment></var></a> || <a href="#ltboxgt"><var><box></var></a>{1,2} || <var><'background-color'></var></pre> + <pre class=prod><dfn + id=ltfinal-bg-layergt><var><final-bg-layer></var></dfn> = <a + href="#ltbg-imagegt"><var><bg-image></var></a> || <a + href="#ltpositiongt"><var><position></var></a> [ / <a + href="#ltbg-sizegt"><var><bg-size></var></a> ]? || <a + href="#ltrepeat-stylegt"><var><repeat-style></var></a> || <a + href="#ltattachmentgt"><var><attachment></var></a> || <a + href="#ltboxgt"><var><box></var></a>{1,2} || <var><'background-color'></var></pre> <p class=note>Note that a color is permitted in <a href="#ltfinal-bg-layergt"><var><final-bg-layer></var></a>, but not @@ -2088,8 +2109,8 @@ <p>Where - <pre - class=prod><dfn id=ltborder-stylegt><var><border-style></var></dfn> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset</pre> + <pre class=prod><dfn + id=ltborder-stylegt><var><border-style></var></dfn> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset</pre> <p>Values have the following meanings: @@ -2270,8 +2291,8 @@ <p>These properties set the thickness of the border. Where - <pre - class=prod><dfn id=ltborder-widthgt><var><border-width></var></dfn> = <var><length></var> | thin | medium | thick</pre> + <pre class=prod><dfn + id=ltborder-widthgt><var><border-width></var></dfn> = <var><length></var> | thin | medium | thick</pre> <p>The <var><length></var> may not be negative. The lengths corresponding to ‘<code class=css>thin</code>’, ‘<code @@ -2773,8 +2794,9 @@ 2em). See borders B and C in the figure. <div class=figure id=reduced-radius> - <p><img alt="[image: rectangle with two tiny rounded corners and two very - large ones, on opposite corners]" src=corner-large-mix> + <p><img + alt="[image: rectangle with two tiny rounded corners and two very large ones, on opposite corners]" + src=corner-large-mix> <p class=caption>These rounded corner might be the result of ‘<code class=css>width: 6em; height: 2.5em; border-radius: 0.5em 2em 0.5em @@ -2867,11 +2889,8 @@ corner effect:</p> <div class=figure> - <p><img alt="Diagram: The border image shows a wavy green border with - more exaggerated waves towards the corners, which are capped by a - disconnected green circle. Four cuts at 124px offsets from each side - divide the image into 124px-wide square corners, 124px-wide but thin - side slices, and a small center square." + <p><img + alt="Diagram: The border image shows a wavy green border with more exaggerated waves towards the corners, which are capped by a disconnected green circle. Four cuts at 124px offsets from each side divide the image into 124px-wide square corners, 124px-wide but thin side slices, and a small center square." src=groovy-border-image-slice.png> <p class=caption>The ‘<a href="#border-image-source"><code @@ -2885,14 +2904,9 @@ follows:</p> <div class=figure> - <p><img alt="Diagram: The image-less (fallback) rendering has a green - double border. The rendering with border-image shows the wavy green - border, with the waves getting longer as they reach the corners. The - corner tiles render as 124px-wide squares and the side tiles repeat a - whole number of times to fill the space in between. Because of the - gradual corner effects, the tiles extend deep into the padding area. The - whole border image effect is outset 31px, so that the troughs of the - waves align just outside the padding edge." src=border-image.png> + <p><img + alt="Diagram: The image-less (fallback) rendering has a green double border. The rendering with border-image shows the wavy green border, with the waves getting longer as they reach the corners. The corner tiles render as 124px-wide squares and the side tiles repeat a whole number of times to fill the space in between. Because of the gradual corner effects, the tiles extend deep into the padding area. The whole border image effect is outset 31px, so that the troughs of the waves align just outside the padding edge." + src=border-image.png> <p class=caption>Diagram of all border-image properties and how they interact, and showing the rendering with and without the border-image in @@ -3084,8 +3098,9 @@ top and bottom values. <div class=figure> - <p><img alt="Diagram: two horizontal cuts and two vertical cuts through an - image" src=slice> + <p><img + alt="Diagram: two horizontal cuts and two vertical cuts through an image" + src=slice> <p class=caption>Diagram illustrating the cuts corresponding to the value ‘<code class=css>25% 30% 12% 20%</code>’ @@ -3169,8 +3184,9 @@ <dd>Numbers represent multiples of the corresponding computed <a href="#the-border-width">border-width</a>. - <dt><dfn id=auto0 title="''auto''!!'border-image-width' - value">‘<code class=css>auto</code>’</dfn> + <dt><dfn id=auto0 + title="''auto''!!'border-image-width' value">‘<code + class=css>auto</code>’</dfn> <dd>If ‘<code class=css>auto</code>’ is specified then the border image width is the intrinsic width or height (whichever is @@ -3331,20 +3347,23 @@ <dd>The image is stretched to fill the area. - <dt><dfn id=repeat0 title="''repeat''!!'border-image-repeat' - value">‘<code class=css>repeat</code>’</dfn> + <dt><dfn id=repeat0 + title="''repeat''!!'border-image-repeat' value">‘<code + class=css>repeat</code>’</dfn> <dd>The image is tiled (repeated) to fill the area. - <dt><dfn id=round0 title="''round''!!'border-image-repeat' - value">‘<code class=css>round</code>’</dfn> + <dt><dfn id=round0 + title="''round''!!'border-image-repeat' value">‘<code + class=css>round</code>’</dfn> <dd>The image is tiled (repeated) to fill the area. If it does not fill the area with a whole number of tiles, the image is rescaled so that it does. - <dt><dfn id=space0 title="''space''!!'border-image-repeat' - value">‘<code class=css>space</code>’</dfn> + <dt><dfn id=space0 + title="''space''!!'border-image-repeat' value">‘<code + class=css>space</code>’</dfn> <dd>The image is tiled (repeated) to fill the area. If it does not fill the area with a whole number of tiles, the extra space is distributed @@ -3643,10 +3662,9 @@ </dl> <div class=figure> - <p><img alt="Illustration: (1) a single box cut in two in between two - lines of text by a page break and (2) two boxes, one before and one after - the page break, both with a border all around and their own background - image" src=box-break.png> + <p><img + alt="Illustration: (1) a single box cut in two in between two lines of text by a page break and (2) two boxes, one before and one after the page break, both with a border all around and their own background image" + src=box-break.png> <p class=caption>Two possibilities for ‘<a href="#box-decoration-break"><code @@ -3720,7 +3738,9 @@ <p>Where <pre class=prod> -<dfn id=ltshadowgt><var><shadow></var></dfn> = inset? && [ <var><length></var>{2,4} && <a href="#ltcolorgt"><var><color></var></a>? ]</pre> +<dfn + id=ltshadowgt><var><shadow></var></dfn> = inset? && [ <var><length></var>{2,4} && <a + href="#ltcolorgt"><var><color></var></a>? ]</pre> <p>The components of each <a href="#ltshadowgt"><var><shadow></var></a> are interpreted as @@ -3805,8 +3825,9 @@ <p>The example below demonstrates the effects of spread and blur on the shadow:</p> - <p class=figure> <img alt="An example of spread and blur on a box with two - round corners and two square ones" src=spread-blur.png></p> + <p class=figure> <img + alt="An example of spread and blur on a box with two round corners and two square ones" + src=spread-blur.png></p> </div> <p>The shadow effects are applied front-to-back: the first shadow is on top @@ -3854,15 +3875,13 @@ <!-- --> 10px 10px;<!-- --></code></pre> - <td> <img alt="A round-cornered box with a light gray shadow the same - shape as the border box offset 10px to the right and 10px down from - directly underneath the box." height=175 src=shadow-outer-round.png - width=175> + <td> <img + alt="A round-cornered box with a light gray shadow the same shape as the border box offset 10px to the right and 10px down from directly underneath the box." + height=175 src=shadow-outer-round.png width=175> - <td> <img alt="A square-cornered box with a light gray shadow the same - shape as the border box offset 10px to the right and 10px down from - directly underneath the box." height=175 src=shadow-outer-square.png - width=175> + <td> <img + alt="A square-cornered box with a light gray shadow the same shape as the border box offset 10px to the right and 10px down from directly underneath the box." + height=175 src=shadow-outer-square.png width=175> <tr> <th> @@ -3873,15 +3892,13 @@ <!-- --> inset<!-- --></code></pre> - <td> <img alt="A round-cornered box with a light gray shadow the - inverse shape of the padding box filling 10px in from the top and left - edges (just inside the border)." height=175 src=shadow-inner-round.png - width=175> + <td> <img + alt="A round-cornered box with a light gray shadow the inverse shape of the padding box filling 10px in from the top and left edges (just inside the border)." + height=175 src=shadow-inner-round.png width=175> - <td> <img alt="A square-cornered box with a light gray shadow the - inverse shape of the padding box filling 10px in from the top and left - edges (just inside the border)." height=175 - src=shadow-inner-square.png width=175> + <td> <img + alt="A square-cornered box with a light gray shadow the inverse shape of the padding box filling 10px in from the top and left edges (just inside the border)." + height=175 src=shadow-inner-square.png width=175> <tr> <th> @@ -3892,17 +3909,13 @@ <!-- --> 10px /* spread */<!-- --></code></pre> - <td> <img alt="A round-cornered box with a light gray shadow the same - shape as the box but 20px taller and wider and offset so that the top - and left edges of the shadow are directly underneath the top and left - edges of the box." height=175 src=shadow-outer-spread-round.png - width=175> + <td> <img + alt="A round-cornered box with a light gray shadow the same shape as the box but 20px taller and wider and offset so that the top and left edges of the shadow are directly underneath the top and left edges of the box." + height=175 src=shadow-outer-spread-round.png width=175> - <td> <img alt="A square-cornered box with a light gray shadow the same - shape as the box but 20px taller and wider and offset so that the top - and left edges of the shadow are directly underneath the top and left - edges of the box." height=175 src=shadow-outer-spread-square.png - width=175> + <td> <img + alt="A square-cornered box with a light gray shadow the same shape as the box but 20px taller and wider and offset so that the top and left edges of the shadow are directly underneath the top and left edges of the box." + height=175 src=shadow-outer-spread-square.png width=175> <tr> <th> @@ -3914,15 +3927,13 @@ <!-- --> inset<!-- --></code></pre> - <td> <img alt="A round-cornered box with a light gray shadow the - inverse shape of the box but 20px narrower and shorter filling 20px in - from the top and left edges (just inside the border)." height=175 - src=shadow-inner-spread-round.png width=175> + <td> <img + alt="A round-cornered box with a light gray shadow the inverse shape of the box but 20px narrower and shorter filling 20px in from the top and left edges (just inside the border)." + height=175 src=shadow-inner-spread-round.png width=175> - <td> <img alt="A round-cornered box with a light gray shadow the - inverse shape of the box but 20px narrower and shorter filling 20px in - from the top and left edges (just inside the border)." height=175 - src=shadow-inner-spread-square.png width=175> + <td> <img + alt="A round-cornered box with a light gray shadow the inverse shape of the box but 20px narrower and shorter filling 20px in from the top and left edges (just inside the border)." + height=175 src=shadow-inner-spread-square.png width=175> </table> </div> @@ -4845,8 +4856,8 @@ href="#ltattachmentgt" title="<attachment>"><strong>3.5.</strong></a> - <li>authoring tool, <a href="#authoring-tool" title="authoring - tool"><strong>8.2.</strong></a> + <li>authoring tool, <a href="#authoring-tool" + title="authoring tool"><strong>8.2.</strong></a> <li>‘<code class=css>auto</code>’ <ul> @@ -4856,8 +4867,8 @@ <li>‘<a href="#border-image-width"><code class=property>border-image-width</code></a>’ value, <a - href="#auto0" title="''auto'', 'border-image-width' - value"><strong>6.3.</strong></a> + href="#auto0" + title="''auto'', 'border-image-width' value"><strong>6.3.</strong></a> </ul> <li>background, <a href="#background" @@ -4880,25 +4891,31 @@ <li>background painting area, <a href="#background-painting-area" title="background painting area"><strong>3.7.</strong></a>, <a - href="#background-painting-area0" title="background painting - area">3.4.</a>, <a href="#background-painting-area1" title="background - painting area">3.4.</a>, <a href="#background-painting-area2" + href="#background-painting-area0" title="background painting area">3.4.</a>, <a - href="#background-painting-area3" title="background painting - area">3.5.</a>, <a href="#background-painting-area4" title="background - painting area">3.11.</a> + href="#background-painting-area1" + title="background painting area">3.4.</a>, <a + href="#background-painting-area2" + title="background painting area">3.4.</a>, <a + href="#background-painting-area3" + title="background painting area">3.5.</a>, <a + href="#background-painting-area4" + title="background painting area">3.11.</a> <li>background-position, <a href="#background-position" title=background-position><strong>3.6.</strong></a> <li>background positioning area, <a href="#background-positioning-area" title="background positioning area"><strong>3.8.</strong></a>, <a - href="#background-positioning-area." title="background positioning - area.">3.4.</a>, <a href="#background-positioning-area.0" + href="#background-positioning-area." + title="background positioning area.">3.4.</a>, <a + href="#background-positioning-area.0" title="background positioning area.">3.9.</a>, <a - href="#background-positioning-area0" title="background positioning - area">3.4.</a>, <a href="#background-positioning-area1" title="background - positioning area">3.6.</a>, <a href="#background-positioning-area2" + href="#background-positioning-area0" + title="background positioning area">3.4.</a>, <a + href="#background-positioning-area1" + title="background positioning area">3.6.</a>, <a + href="#background-positioning-area2" title="background positioning area">7.1.</a> <li>background-repeat, <a href="#background-repeat" @@ -4940,13 +4957,15 @@ <ul> <li>‘<a href="#background-clip"><code class=property>background-clip</code></a>’ value, <a - href="#border-box" title="''border-box'', 'background-clip' - value"><strong>3.7.</strong></a> + href="#border-box" + title="''border-box'', 'background-clip' value"><strong>3.7.</strong></a> + <li>‘<a href="#background-origin"><code class=property>background-origin</code></a>’ value, <a - href="#border-box0" title="''border-box'', 'background-origin' - value"><strong>3.8.</strong></a> + href="#border-box0" + title="''border-box'', 'background-origin' value"><strong>3.8.</strong></a> + </ul> <li>border-color, <a href="#border-color" @@ -4955,8 +4974,8 @@ <li>border-image, <a href="#border-image" title=border-image><strong>6.7.</strong></a> - <li>border image area, <a href="#border-image-area" title="border image - area"><strong>6.4.</strong></a> + <li>border image area, <a href="#border-image-area" + title="border image area"><strong>6.4.</strong></a> <li>border-image-outset, <a href="#border-image-outset" title=border-image-outset><strong>6.4.</strong></a> @@ -5036,8 +5055,9 @@ <ul> <li>‘<a href="#background-position"><code class=property>background-position</code></a>’ value, <a - href="#bottom" title="''bottom'', 'background-position' - value"><strong>3.6.</strong></a> + href="#bottom" + title="''bottom'', 'background-position' value"><strong>3.6.</strong></a> + </ul> <li><a href="#ltboxgt"><var><box></var></a>, <a href="#ltboxgt" @@ -5053,8 +5073,9 @@ <ul> <li>‘<a href="#background-position"><code class=property>background-position</code></a>’ value, <a - href="#center" title="''center'', 'background-position' - value"><strong>3.6.</strong></a> + href="#center" + title="''center'', 'background-position' value"><strong>3.6.</strong></a> + </ul> <li>‘<code class=css>clone</code>’, <a href="#clone" @@ -5062,8 +5083,8 @@ <li>color <ul> - <li>background, <a href="#background-color0" title="color, - background">3.2.</a> + <li>background, <a href="#background-color0" + title="color, background">3.2.</a> </ul> <li><a href="#ltcolorgt"><var><color></var></a>, <a @@ -5077,8 +5098,9 @@ <ul> <li>‘<a href="#background-clip"><code class=property>background-clip</code></a>’ value, <a - href="#content-box" title="''content-box'', 'background-clip' - value"><strong>3.7.</strong></a> + href="#content-box" + title="''content-box'', 'background-clip' value"><strong>3.7.</strong></a> + </ul> <li>‘<code class=css>cover</code>’, <a href="#cover" @@ -5130,8 +5152,9 @@ <ul> <li>‘<a href="#background-position"><code class=property>background-position</code></a>’ value, <a - href="#left" title="''left'', 'background-position' - value"><strong>3.6.</strong></a> + href="#left" + title="''left'', 'background-position' value"><strong>3.6.</strong></a> + </ul> <li>local, <a href="#local0" title=local><strong>3.5.</strong></a> @@ -5143,13 +5166,14 @@ <ul> <li>‘<a href="#background-image"><code class=property>background-image</code></a>’ value, <a - href="#none" title="''none'', 'background-image' - value"><strong>3.3.</strong></a> + href="#none" + title="''none'', 'background-image' value"><strong>3.3.</strong></a> <li>‘<a href="#border-image-source"><code class=property>border-image-source</code></a>’ value, <a - href="#none1" title="''none'', 'border-image-source' - value"><strong>6.1.</strong></a> + href="#none1" + title="''none'', 'border-image-source' value"><strong>6.1.</strong></a> + <li>‘<a href="#border-style"><code class=property>border-style</code></a>’ value, <a href="#none0" @@ -5160,8 +5184,9 @@ <ul> <li>‘<a href="#background-repeat"><code class=property>background-repeat</code></a>’ value, <a - href="#no-repeat" title="''no-repeat'', 'background-repeat' - value"><strong>3.4.</strong></a> + href="#no-repeat" + title="''no-repeat'', 'background-repeat' value"><strong>3.4.</strong></a> + </ul> <li>‘<code class=css>outset</code>’, <a href="#outset" @@ -5171,13 +5196,15 @@ <ul> <li>‘<a href="#background-clip"><code class=property>background-clip</code></a>’ value, <a - href="#padding-box" title="''padding-box'', 'background-clip' - value"><strong>3.7.</strong></a> + href="#padding-box" + title="''padding-box'', 'background-clip' value"><strong>3.7.</strong></a> + <li>‘<a href="#background-origin"><code class=property>background-origin</code></a>’ value, <a - href="#padding-box0" title="''padding-box'', 'background-origin' - value"><strong>3.8.</strong></a> + href="#padding-box0" + title="''padding-box'', 'background-origin' value"><strong>3.8.</strong></a> + </ul> <li><a href="#ltpositiongt"><var><position></var></a>, <a @@ -5190,13 +5217,15 @@ <ul> <li>‘<a href="#background-repeat"><code class=property>background-repeat</code></a>’ value, <a - href="#repeat" title="''repeat'', 'background-repeat' - value"><strong>3.4.</strong></a> + href="#repeat" + title="''repeat'', 'background-repeat' value"><strong>3.4.</strong></a> + <li>‘<a href="#border-image-repeat"><code class=property>border-image-repeat</code></a>’ value, <a - href="#repeat0" title="''repeat'', 'border-image-repeat' - value"><strong>6.5.</strong></a> + href="#repeat0" + title="''repeat'', 'border-image-repeat' value"><strong>6.5.</strong></a> + </ul> <li><a href="#ltrepeat-stylegt"><var><repeat-style></var></a>, <a @@ -5216,21 +5245,23 @@ <ul> <li>‘<a href="#background-position"><code class=property>background-position</code></a>’ value, <a - href="#right" title="''right'', 'background-position' - value"><strong>3.6.</strong></a> + href="#right" + title="''right'', 'background-position' value"><strong>3.6.</strong></a> + </ul> <li>‘<code class=css>round</code>’ <ul> <li>‘<a href="#background-repeat"><code class=property>background-repeat</code></a>’ value, <a - href="#round" title="''round'', 'background-repeat' - value"><strong>3.4.</strong></a> + href="#round" + title="''round'', 'background-repeat' value"><strong>3.4.</strong></a> <li>‘<a href="#border-image-repeat"><code class=property>border-image-repeat</code></a>’ value, <a - href="#round0" title="''round'', 'border-image-repeat' - value"><strong>6.5.</strong></a> + href="#round0" + title="''round'', 'border-image-repeat' value"><strong>6.5.</strong></a> + </ul> <li>scroll, <a href="#scroll0" title=scroll><strong>3.5.</strong></a> @@ -5251,37 +5282,38 @@ <ul> <li>‘<a href="#background-repeat"><code class=property>background-repeat</code></a>’ value, <a - href="#space" title="''space'', 'background-repeat' - value"><strong>3.4.</strong></a> + href="#space" + title="''space'', 'background-repeat' value"><strong>3.4.</strong></a> <li>‘<a href="#border-image-repeat"><code class=property>border-image-repeat</code></a>’ value, <a - href="#space0" title="''space'', 'border-image-repeat' - value"><strong>6.5.</strong></a> + href="#space0" + title="''space'', 'border-image-repeat' value"><strong>6.5.</strong></a> + </ul> <li>‘<code class=css>stretch</code>’, <a href="#stretch" title="''stretch''"><strong>6.5.</strong></a> - <li>style sheet, <a href="#style-sheet" title="style - sheet"><strong>8.1.</strong></a> + <li>style sheet, <a href="#style-sheet" + title="style sheet"><strong>8.1.</strong></a> <ul> - <li>as conformance class, <a href="#style-sheet0" title="style sheet, as - conformance class"><strong>8.2.</strong></a> + <li>as conformance class, <a href="#style-sheet0" + title="style sheet, as conformance class"><strong>8.2.</strong></a> </ul> <li>‘<code class=css>top</code>’ <ul> <li>‘<a href="#background-position"><code class=property>background-position</code></a>’ value, <a - href="#top" title="''top'', 'background-position' - value"><strong>3.6.</strong></a> + href="#top" + title="''top'', 'background-position' value"><strong>3.6.</strong></a> </ul> <li>UA, <a href="#ua" title=UA><strong>8.1.</strong></a> - <li>User Agent, <a href="#user-agent" title="User - Agent"><strong>8.1.</strong></a> + <li>User Agent, <a href="#user-agent" + title="User Agent"><strong>8.1.</strong></a> <li>viewport, <a href="#viewport" title=viewport>3.5.</a> </ul> Index: Overview.src.html =================================================================== RCS file: /sources/public/csswg/css3-background/Overview.src.html,v retrieving revision 1.261 retrieving revision 1.262 diff -u -d -r1.261 -r1.262 --- Overview.src.html 28 Sep 2011 23:07:13 -0000 1.261 +++ Overview.src.html 11 Nov 2011 16:53:21 -0000 1.262 @@ -1152,9 +1152,9 @@ <p>Where -<pre class=prod><dfn><var><bg-layer></var></dfn> = <var><bg-image></var> || <var><bg-position></var> [ / <var><bg-size></var> ]? || <var><repeat-style></var> || <var><attachment></var> || <var><box></var>{1,2} </pre> +<pre class=prod><dfn><var><bg-layer></var></dfn> = <var><bg-image></var> || <var><position></var> [ / <var><bg-size></var> ]? || <var><repeat-style></var> || <var><attachment></var> || <var><box></var>{1,2} </pre> -<pre class=prod><dfn><var><final-bg-layer></var></dfn> = <var><bg-image></var> || <var><bg-position></var> [ / <var><bg-size></var> ]? || <var><repeat-style></var> || <var><attachment></var> || <var><box></var>{1,2} || <var><'background-color'></var></pre> +<pre class=prod><dfn><var><final-bg-layer></var></dfn> = <var><bg-image></var> || <var><position></var> [ / <var><bg-size></var> ]? || <var><repeat-style></var> || <var><attachment></var> || <var><box></var>{1,2} || <var><'background-color'></var></pre> <p class=note>Note that a color is permitted in <var><final-bg-layer></var>, but not in <var><bg-layer></var>.
Received on Friday, 11 November 2011 16:53:28 UTC