1
edit
Changes
no edit summary
<span style="margin:0;background:#ffff33;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">This document is a work in progress and is subject to change.</span><br /><br />
== Summary ==
This property sets the background image of an element. When setting a background image, authors should also specify a background color that will be used when the image is unavailable. When the image is available, it is rendered on top of the background color. (Thus, the color is visible in the transparent parts of the image).
Values for this property are either <uri>, to specify the image, or 'none', when no image is used.
<pre>
BODY { background-image: url("marble.gif") }
P { background-image: none }</pre>
<table border="0">
<tr>
<td><b>Applicability:</b></td><td>The background-repeat property can be used for all CSS elements.</td>
</tr>
<tr>
<td><b>[http://developer.mozilla.org/en/docs/CSS:%40media#Media_groups Media Group:]</b>
</td><td>Visual</td>
</tr>
<tr>
<td><b>Inherited:</b></td><td>No</td>
</tr>
</table>
== Syntax ==
If a background image is specified, this property specifies whether the image is repeated (tiled), and how. All tiling covers the content and padding areas of a box. A value of 'repeat' means that the image is repeated both horizontally and vertically. The 'repeat-x' ('repeat-y') value makes the image repeat horizontally (vertically), to create a single band of images from one side to the other. With a value of 'no-repeat', the image is not repeated.:
<pre>
BODY {
background: white url("pendant.gif");
background-repeat: repeat-y;
background-position: center;
}
</pre>
== Legal Values ==
The following units are valid for defining background-repeat:
*repeat
**The image is repeated both horizontally and vertically.
*repeat-x
**The image is repeated horizontally only.
*repeat-y
**The image is repeated vertically only.
*no-repeat
**The image is not repeated: only one copy of the image is drawn.
== Mozilla Recommended Values ==
[http://developer.mozilla.org/en/docs/CSS:background-repeat MDC document on background-repeat]
== Notes ==
The [http://www.w3.org World Wide Web Consortium (W3C)] provides a free online [http://jigsaw.w3.org/css-validator/ CSS validation service].
== Specification Conformance ==
*[http://www.w3.org/TR/REC-CSS1#background-repeat CSS 1 ]
*[http://www.w3.org/TR/REC-CSS2/colors.html CSS 2]
*CSS 3 (specification not yet published)
== Browser Compatibility ==
* Internet Explorer
* Firefox
* Opera
== Summary ==
This property sets the background image of an element. When setting a background image, authors should also specify a background color that will be used when the image is unavailable. When the image is available, it is rendered on top of the background color. (Thus, the color is visible in the transparent parts of the image).
Values for this property are either <uri>, to specify the image, or 'none', when no image is used.
<pre>
BODY { background-image: url("marble.gif") }
P { background-image: none }</pre>
<table border="0">
<tr>
<td><b>Applicability:</b></td><td>The background-repeat property can be used for all CSS elements.</td>
</tr>
<tr>
<td><b>[http://developer.mozilla.org/en/docs/CSS:%40media#Media_groups Media Group:]</b>
</td><td>Visual</td>
</tr>
<tr>
<td><b>Inherited:</b></td><td>No</td>
</tr>
</table>
== Syntax ==
If a background image is specified, this property specifies whether the image is repeated (tiled), and how. All tiling covers the content and padding areas of a box. A value of 'repeat' means that the image is repeated both horizontally and vertically. The 'repeat-x' ('repeat-y') value makes the image repeat horizontally (vertically), to create a single band of images from one side to the other. With a value of 'no-repeat', the image is not repeated.:
<pre>
BODY {
background: white url("pendant.gif");
background-repeat: repeat-y;
background-position: center;
}
</pre>
== Legal Values ==
The following units are valid for defining background-repeat:
*repeat
**The image is repeated both horizontally and vertically.
*repeat-x
**The image is repeated horizontally only.
*repeat-y
**The image is repeated vertically only.
*no-repeat
**The image is not repeated: only one copy of the image is drawn.
== Mozilla Recommended Values ==
[http://developer.mozilla.org/en/docs/CSS:background-repeat MDC document on background-repeat]
== Notes ==
The [http://www.w3.org World Wide Web Consortium (W3C)] provides a free online [http://jigsaw.w3.org/css-validator/ CSS validation service].
== Specification Conformance ==
*[http://www.w3.org/TR/REC-CSS1#background-repeat CSS 1 ]
*[http://www.w3.org/TR/REC-CSS2/colors.html CSS 2]
*CSS 3 (specification not yet published)
== Browser Compatibility ==
* Internet Explorer
* Firefox
* Opera
