1.CSS background属性与background-image属性

在书写css样式时，background属性与background-image经常用来设置背景图片，容易搞混。

background属性包含background-image属性，是在一个声明中设置所有的背景属性。

连background-image在内，background属性包含以下：

background-color 规定要使用的背景颜色。1

background-position 规定背景图像的位置。1

background-size 规定背景图片的尺寸。3

background-repeat 规定如何重复背景图像。1

background-origin 规定背景图片的定位区域。3

background-clip 规定背景的绘制区域。3

background-attachment 规定背景图像是否固定或者随着页面的其余部分滚动。1

background-image 规定要使用的背景图像。1

inherit 规定应该从父元素继承 background 属性的设置。1

通常在写css的时候，一般都直接用background做全局设置，不单独去设置。

用background做全局设置时，要将所有背景属性写在一个声明中

body { background: red }

p { background: url("chess.png") 40% / 10em gray round fixed border-box; }

分拆写法如下

body {

background-color: red;

background-position: 0% 0%;

background-size: auto;

background-repeat: repeat;

background-clip: border-box;

background-origin: padding-box;

background-attachment: scroll;

background-image: none }

p {

background-color: gray;

background-position: 40% 50%;

background-size: 10em 10em;

background-repeat: round;

background-clip: border-box;

background-origin: border-box;

background-attachment: fixed;

background-image: url(chess.png) }

background：no-repeat scroll 0px 0px / 300px 300px rgba(0, 0, 0, 0);

background-position与background-size之间必须用 / 做分割

前面是background-position 后面是 background-size