CSS学习笔记（五）背景

　　在CSS中，每个元素盒子都可以理解成由两个图层组成：

　　前景层：内容（文本和图片）和边框。

　　背景层：用实色填充（background-color属性），也可以包含多个背景图片（background-image属性）。背景图片叠加在背景颜色之上。

　　CSS背景属性：

　　1、背景颜色：backgroud-color

　　2、背景图片：bakcgroud-image

　　　　默认情况下背景图片以元素左上角为起点，沿水平和垂直方向出现，最终填满整个背景区域。

　　3、背景重复：background-repeat

　　　　repeat:默认值；

　　　　repeat-x:x方向平铺；

　　　　repeat-y:y方向平铺；

　　　　no-pepeat:任何方向都不平铺；

　　4、背景位置：background-position

　　有5个关键值：top|left|right|bottom|center

　　其中任意两个都可以组合起来作为该属性的值。该属性同时设定元素和图片的原点，原点决定了元素和图片中某一点的水平和垂直坐标。

　　默认情况下，原点位于左下角。

　　也可以通过百分比和使用绝对或者相对的单位的数值。

　　5、背景尺寸：background-size

　　控制背景图片的尺寸，可设定的值如下：百分比|像素|cover:拉大图片，使其完全填满背景区；保持宽高比。|contain：缩放图片，使其恰好适合背景区；保持宽高比。

　　6、背景粘附：background-attachment，控制滚动元素内的背景图片是否随元素滚动而滚动

　　有两个值：scroll|fixed　

　　7、background-clip、background-origin、background-break（目前尚未得到广泛支持）

　　8、多背景图片：CSS3可以给元素背景添加多个背景图片。