### 1、CSS 精灵
**概述:**
CSS精灵英文叫法 `CSS sprites`,通常被解释为“CSS 图像拼合” 或 “CSS 贴图定位”,其实就是把网页中一些背景图片整合到一张图片文件中,再利用 CSS “background-image”,“background- repeat”,“background-position”的组合进行背景定位,background-position 精确的定位出背景图片的位置。
#### 2.1 精灵图的原理
##### 2.1.1 实现步骤
1. 通常要限定容器大小
2. 图片拼合
3. 背景定位
##### 2.1.2 优缺点
**优点**
- 减少网页的 http 请求,从而大大的提高页面的性能
- 图片命名上的困扰
- 更换风格方便