css设置背景

css2设置背景相关属性有如下：
background : 简写属性，作用是将背景属性设置在一个声明中。
background-color : 设置元素的背景颜色。
background-image : 把图像设置为背景。
background-repeat : 设置背景图像是否以及如何重复
background-position : 设置背景图像的起始位置
background-attachment ：背景图像是否固定或者随着页面的其余部分滚动。

基本属性
背景色（background-color）
background-color属性用纯色来填充背景，用法为background-color: css颜色表示
eg：

background-color:transparentbackground-color:rgb(0,0,255)background-color:#0000ff

背景图（background-image）
background-image属性允许指定一个图片展示在背景中。可以和background-color一起使用，如果图片不重复的话，图片覆盖不到的地方都会被背景色填充。用法：
background-image: url(image’s url);

背景平铺（background-repeat）
该属性的值在默认情况下为repeat，默认吧图片在水平和垂直方向平铺以铺满整个元素。该属性可以设置为如下：

background-repeat:repeat; 默认，背景图像将在垂直和水平方向重复。background-repeat:norepeat; 背景图像将仅显示一次。background-repeat:repeat-x; 背景图片将在水平方向重复background-repeat:repeat-y; 背景图片将在垂直方向重复background-repeat:inherit; 从父元素继承background-repeat属性的设置

背景定位（background-positon）
该属性用来设置背景图像的起始位置。如果背景图像重复，将从这一点开始。表示的时候，先表示x轴（水平位置），再表示y轴（垂直位置）。默认值：0% 0%
具体定位的值如下：
x轴：top、center、bottom、x%、xpos
y轴：left、center、right、y%、ypos

背景附者（background-attachment）
backgroud-attachment属性用来设置背景图像是否固定或者随着也没的其余部分滚动。
取值：
scroll:背景图像会随着页面其余部分的滚动而移动。（默认为scroll）
fixed:当页面的其余部分滚动时，背景图像不会移动。
inherit:从父元素继承background-attachment属性的设置。

css背景表示
1、将所有的属性写出来：

background-color:transparent;background-image:url(image's url);background-position: 50% 0;background-attachment:scroll;background-repeat:repeat-y;

2、合为单独一行

background:transparent url(image's url) 50% 0 scroll repeat-y;

css3中设置背景
1、多背景
css3中，可以对一个元素应用一个或多个图片作为背景。代码和css2中的一样，只需要用逗号类区别各个图片。第一个声明的图片定位在元素顶部，其它的图片按序在其下排列。

2、新属性
背景修剪（background-clip）
语法：background-clip: border-box|padding-box|content-box
border-box:背景被裁剪到边框盒。
padding-box:背景被裁剪到内边距框。
content-box:背景被裁剪到内容框。

背景原点（background-origin）
语法：background-origin: border-box|padding-box|content-box;
border-box:背景图像相对于内边距框来定位。
padding-box:背景图像相对于内边框盒来定位。
content-box:背景图像相对于内容框来定位。

背景尺寸（background-size）
background-size属性用来规定背景图像的尺寸
语法：background-size:length|percentage|cover|contain;
值：
length:设置背景图像的高度和宽度。第一个值设置宽度，第二个设置高度。如果只设置一个值，则第二个值会被设置为“auto”
percentage:以父元素的百分比来设置背景图像的宽度和高度。
cover:把背景图像扩展到足够大，让背景图像完全覆盖背景区域。
contain:把图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。