background-repeat 背景重复

设置图片平铺的方式。 <repeat-style> = repeat-x | repeat-y | [repeat | space | round | no-repeat]{1,2}

语法：

{ background-repeat : sBackgroundRepeat }

默认值： repeat
继承性： 否
DOM 语法： object.style.backgroundRepeat = sBackgroundRepeat
适用于： 所有元素
浏览器支持： Internet ExplorerFirefoxChromeOperaSafari

可能的值：

<repeat-style> [ , <repeat-style> ]*

值 描述
repeat-x 等同于 repeat no-repeat。水平方向重复平铺。
repeat-y 等同于 no-repeat repeat。垂直方向重复平铺。
repeat 等同于 repeat repeat。水平和垂直方向都平铺
space 等同于 space space。无剪切填充整个背景，并且第一张和最后一张背景图是紧靠容器的边缘。
round 等同于 round round。进行缩放以完整地铺满整个容器。
no-repeat 等同于 no-repeat no-repeat。图片只显示一次。

说明：

如果 <repeat-style> 设置两个关键字，则单元格代表水平方向，第二个代表垂直方向。

例子 1：

<style>
div
{
 height:150px;width:600px;
 border:1px solid red; 
 background-image:url("http://dotnet.aspx.cc/Images/logoSite.gif");  
}
#cavas1{background-repeat:space space;}
#cavas2{background-repeat:round round;}
#cavas3{background-repeat:space round;}
#cavas4{background-repeat:round space;}
</style>

<div id="cavas1"></div>
<br /><br />
<div id="cavas2"></div>
<br /><br />
<div id="cavas3"></div>
<br /><br />
<div id="cavas4"></div>
测试结果：Internet Explorer 9，Opera 11 都支持 space round 属性值。
点击查看例子 1 的效果
本属性最后更新时间：2011-04-28 16:03:22