知识点：
CSS3 背景图像区域
CSS3 背景图像定位
CSS3 背景图像大小
CSS3 多重背景图像
CSS3 背景属性整合
一、CSS3 背景图像区域
background-clip 属性
background-clip属性指定背景绘制区域
【语法】
background-clip: border-box|padding-box|content-box;
border-box:背景被裁剪到边框盒
padding-box:背景被裁剪到内边距框
content-box：背景被裁剪到内容框
【兼容性】
IE9+、FireFox、Chrome、Safari、Opera
二、CSS3 背景图像定位
background-origin属性
background-origin属性指定background-position属性应该是相对位置
【语法】
background-origin: padding-box|border-box|content-box;
background-origin 设置元素背景图片的原始起始位置
定义背景图片位置，两个值：水平和垂直偏移量
background-origin:content-box;背景图像相对于内容框来定位。
background-origin:padding-box;背景图像相对于内边距框来定位。
background-origin:border-box;背景图像相对于边框来定位
【兼容性】
IE9+、FireFox4+、Chrome、Safari5+、Opera
三、CSS3 背景图像大小
background-size属性
background-size属性指定背景图片大小
【语法】
background-size: length|percentage|cover|contain;
属性值（percentage百分比）：0%~100%之间的任何值
第二个值可有可无，如没有默认为auto
当只设置第一个值时，第二个值根据图片宽度值来等比缩放
当两个值都有，按设置值大小显示图片
cover:即将背景图片等比例缩放以填满整个容器
contain：即将背景图片等比例缩放至某一边紧贴容器边缘为止
【兼容性】
IE9+、FireFox4+、Chrome、Safari5+、Opera
四、CSS3 多重背景图像
CSS3 允许您为元素使用多个背景图像
【语法】
background-image: url(img1.jpg), url(img2.png);
元素引用多个背景图片，前面图片依此覆盖后面图。
五、CSS3 背景属性整合
背景缩写属性可以在一个声明中设置所有的背景属性
【语法】
background: color position size repeat origin clip attachment image;
