CSS中的background属性
CSS中的background添加了很多属性（截图来自网络），做个笔记熟悉一下。
该图来自网络
1、background-attachment
属性值：fixed | scroll | local;
默认值：scroll,同时所有元素;
fixed： 背景图像相对于窗体固定。
scroll： 背景图像相对于元素固定。当元素内容滚动时背景图像不会跟着滚动，因为背景图像总是要跟着元素本身。但会随元素的祖先元素或窗体一起滚动。
local： 背景图像相对于元素内容固定。当元素随元素滚动时背景图像也会跟着滚动，因为背景图像总是要跟着内容。（CSS3）
2、background-clip
属性值：border-box | padding-box | content-box | text
默认值：border-box
padding-box： 从padding区域（不含padding）开始向外裁剪背景。
border-box： 从border区域（不含border）开始向外裁剪背景。
content-box： 从content区域开始向外裁剪背景。
从上面的图应该很容易就看出其中那个的差别和用法，background-clip用来裁剪背景图片，使用不同
的属性值达到不同的效果。
从字面上来理解很很简单：
border-box 是一个宽度=border+padding+content的盒子；
padding-box是一个宽度=padding+content的盒子；
border-box 是一个宽度=content的盒子；
把一个上下底面穿透的盒子放在图片上，从顶上俯瞰。管中窥豹的感觉，有木有！
3、background-origin
属性值：border-box | padding-box | content-box；
默认值：padding-box；
padding-box： 从padding区域（含padding）开始显示背景图像。
border-box： 从border区域（含border）开始显示背景图像。
content-box： 从content区域开始显示背景图像。
理解参照background-clip
4、background-size
属性值：[ <length> | <percentage> | auto ]{1,2} | cover | contain；
默认值：auto；
length： 用长度值指定背景图像大小。不允许负值。
percentage： 用百分比指定背景图像大小。不允许负值。
auto： 背景图像的真实大小。
cover： 将背景图像等比缩放到完全覆盖容器，背景图像有可能超出容器。
contain： 将背景图像等比缩放到宽度或高度与容器的宽度或高度相等，背景图像始终被包含在容器内。 
