3.1.background-color

background-color: 设置对象的背景颜色。

· 属性值

transparent：默认值(背景色透明)。

{color}：指定颜色。

· 示例

div { background-color: #666666; }div { background-color: red; }

3.2 background-image

background-image: 设置对象的背景图像。

· 属性值

none：默认值(无背景图)。

url({url})：使用绝对或相对 url 地址指定背景图像。

· 示例

div { background-image: none; }div { background-image: url('../images/pic.png') }

3.3 background-repeat

background-repeat: 设置对象的背景图像铺排方式。

· 属性值

repeat：默认值(背景图像在纵向和横向平铺)。

no-repeat：背景图像不平铺。

repeat-x ：背景图像仅在横向平铺。

repeat-y：背景图像仅在纵向平铺。

· 示例

div {background-image: url('../images/pic.png'); background-repeat: repeat-y;}

3.4 background-position

background-position: 设置对象的背景图像位置。

· 属性值

{x-number | top | center | bottom } {y-number | left | center | right }：控制背景图片在元素的位置：x轴 、y轴。其铺排方式为no-repeat。

· 示例

div { background-image: url('../images/pic.png'); background-repeat: no-repeat; background-position: 50px 50px;}

3.5 background-attachment

background-attachment: 设置对象的背景图像滚动位置。

· 属性值

· scroll：默认值。背景图像会随着页面其余部分的滚动而移动。

· fixed: 当页面的其余部分滚动时，背景图像不会移动。

· 示例

body { background-image: url('../images/pic.png'); background-repeat: no-repeat; background-attachment: fixed;}

3.6 background

background 简写属性：在一个声明中设置所有的背景属性。

· 语法

background: color image repeat attachment position

· 示例

body { background: #fff url('../images/pic.png') no-repeat fixed center center }