background 是一种 CSS 简写属性，可以在一次声明中定义一个或多个属性： background-clip 、 background-color 、 background-image 、 background-origin 、 background-position 、 background-repeat 、 background-size ，和 background-attachment 。因此，background属性的全写应为：

background: <bg-color> <bg-imge> <position/bg-size> <bg-repeat> <bg-origin> <bg-clip> <bg-attachment>

当然，实际使用过程中，我们很难将多个属性值共写为在一起。因为这样既不美观，又容易把自己搞晕。所以，一般我们单独使用background属性时，一般只使用了其中了1~3属性。示例如下：

/* 使用 <background-color> */
background: green;

/* 使用 <bg-image> 和 <repeat-style> */
background: url("test.jpg") repeat-y;

/* 使用 <box> 和 <background-color> */
background: border-box red;

/* 将背景设为一张居中放大的图片 */
background: no-repeat center/80% url("../img/image.png");

为了更加全面的了解并熟练使用background的相关属性，以下对较为常用的几个属性进行详细说明。

01 background-attachment

该属性决定背景图像的位置是在视口内固定，或者随着包含它的区块滚动。它的属性值及对用关系见下表：

02 background-clip

该属性设置元素的背景（背景图片或颜色）是否延伸到边框、内边距盒子、内容盒子下面。它的属性值及对用关系见下表：

03 background-color

该属性会设置元素的背景色，属性的值为 颜色值 或 关键字（transparent 、inherit）二者选一。

04 background-image

该属性用于为一个元素的背景设置一个或多个背景图像。其中，元素的背景是元素的总大小，包括填充和边界，但不包括边距。默认情况下，background-image放置在元素的左上角，并重复垂直和水平方向。它的属性值及对用关系见下表：

TIPS：若该属性填入两个及以上的图像，那么第一个图像为最接近用户的图像，即第一个图像的层级（z-index）最高

05 background-origin

该属性规定了指定背景图片background-image属性的原点位置背景相对区域。但当background-attachment为fixed时，该属性将不起作用。它的属性值及对用关系见下表：