七、css背景和精灵图

1.背景颜色：background-color：值；

2.背景图片：background-image:url("图片地址")；

3.背景图片的平铺属性：background-repeat:值；

取值：no-repeat、repeat-y、repeat-x

4.背景定位：用来控制背景图片位置

background-position:水平值  垂直值；

取值可以是方位词(left、center、right)，也可以是像素值；

应用场景：精灵图的定位，或者主题图片无论怎样拉伸都居中显示

5.关联方式：设置背景是否会随着滚动条滚动；

background-attachment：值；

取值：scroll默认取值，会滚动；

    fixed不会滚动

6.背景缩写：

background：颜色 图片 平铺方式 关联方式 定位方式；

7.背景图片和插入图片区别：

背景图片仅为装饰，不占用空间，插入图片会占用空间；

背景图片有定位属性，方便控制，插入图片无定位属性；

插入图片语义比背景图片强，可被搜索引擎收录；

8.css精灵图：一种图像的合成技术，减少请求次数，降低服务器处理压力；

精灵图需要配合背景图片和背景定位来使用；

background-image:url("图片地址") 0 0 no-repeat；

精灵图：如下图，将很多小的图片合成到一张图片上，通过背景图片及定位显示需要显示的图像；