background 通常后面都跟着一大串的参数,拆分语法如下:

background 拆解可以分为以下几种参数:

background : background-color || background-image || background-repeat || background-attachment || background-position

说明:
如使用该复合属性定义其单个参数,则其他参数的默认值将无条件覆盖各自对应的单个属性设置。
默认值为:transparent none repeat scroll 0% 0%。

尽管该属性不可继承,但如果未指定,其父对象的背景颜色和背景图将在对象下面显示。
对应的脚本特性为background。请参阅我编写的其他书目。

示例:

div { background: red no-repeat scroll 5% 60%; }
body { background: url("images/aardvark.gif") repeat-y; }
pre { background: url("images/aardvark.gif") top; }
caption { background: fuchsia; }

一:background-attachment

语法:
background-attachment : scroll | fixed
参数:
scroll : 背景图像是随对象内容滚动
fixed : 背景图像固定
说明:
设置或检索背景图像是随对象内容滚动还是固定的。
对应的脚本特性为backgroundAttachment。
示例:

html { background-image: url("anasazi.tif"); background-attachment: fixed; }

二:background-color

语法:
background-color : transparent | color
参数:
transparent : 背景色透明
color : 指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索对象的背景颜色。
对应的脚本特性为backgroundColor。请参阅我编写的其他书目。
示例:

p { background-color: silver }
div { background-color: rgb(223,71,177) }
body { background-color: #98AB6F }
pre { background-color: transparent; }

三:background-image

语法:
background-image : none | url (url)
参数:
none : 无背景图
url : 使用绝对或相对地址指定背景图像
说明:
设置或检索对象的背景图像。
对应的脚本特性为backgroundImage。请参阅我编写的其他书目。
示例:
code { background-image: url("comet.jpg"); }
blockquote { background-image: url("http://www.dzwebs.net/ImageFile/121.gif"); }
br { background-image: url(http://www.dzwebs.net/ImageFile/123.gif); }
body { background-image: none; }

四:background-position

语法有以下两种,分别对应不同的数值:
background-position : length || length
background-position : position || position
参数:
length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位
position : top | center | bottom | left | center | right
说明:
设置或检索对象的背景图像位置。必须先指定background-image属性。默认值为:(0% 0%)。
如果只指定了一个值,该值将用于横坐标。纵坐标将默认为50%。第二个值将用于纵坐标。
该属性定位不受对象的补丁属性(padding)设置影响。
对应的脚本特性为backgroundPosition。请参阅我编写的其他书目。
示例:

div { background: url("images/123.gif"); background-position: 35% 80%; }
menu { background: url("images/456.gif"); background-position: 35% 2.5cm; }
a { background: url("images/789.gif"); background-position: 3.25in; }
body { background: url("images/aardvark.gif"); background-position: top right; }

五:background-positionX

语法:
background-positionX : length | left | center | right
参数:
length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位
left : 居左
center : 居中
right : 居右
说明:
设置或检索对象的背景图像横坐标位置。必须先指定background-image属性。默认值为:0%。
该属性定位不受对象的补丁属性(padding)设置影响。
对应的脚本特性为backgroundPositionX。请参阅我编写的其他书目。
示例:

p { background-image: url("images/789.gif"); background-positionX: 35%; background-repeat:no-repeat; }

六:background-positionY

语法:
background-positionY : length | top | center | bottom
参数:
length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位
top : 居顶
center : 居中
bottom :居底
说明:
设置或检索对象的背景图像纵坐标位置。必须先指定background-image属性。默认值为:0%。
该属性定位不受对象的补丁属性(padding)设置影响。
对应的脚本特性为backgroundPositionY。请参阅我编写的其他书目。
示例:

p { background-image: url("图片地址"); background-positionY: 35%; background-repeat:no-repeat; }

七:background-repeat

语法:
background-repeat : repeat | no-repeat | repeat-x | repeat-y
参数:
repeat : 背景图像在纵向和横向上平铺
no-repeat : 背景图像不平铺
repeat-x : 背景图像在横向上平铺
repeat-y : 背景图像在纵向平铺
说明:
设置或检索对象的背景图像是否及如何铺排。必须先指定对象的背景图像。
对应的脚本特性为backgroundRepeat。请参阅我编写的其他书目。
示例:

menu { background: url("图片地址"); background-repeat: repeat-y; }
p { background: url("图片地址"); background-repeat: no-repeat; }

八:layer-background-color

语法:
layer-background-color : transparent | color
参数:
transparent :背景色透明
color :指定颜色。请参阅颜色单位和附录:颜色表
说明:
设置或检索对象整个区域的背景颜色。
示例:

div { layer-background-color: transparent; }

九:layer-background-image

语法:
layer-background-image : none | url (url)
参数:
none : 无背景图
url :使用绝对或相对地址指定背景图像
说明:
设置或检索对象整个区域的背景图像。
示例:

code { position: absolute; top: 100px; left: 300px; width: 200px; border: thin solid black; background-image: url("图片地址"); layer-background-image: url("图片地址"); }