CSS笔记（五）之精灵图（雪碧图）

精灵图的核心：

• 精灵技术主要针对于背景图片使用，把多个小图片整合到一张大图片中
• 移动背景图片的位置，通过background-position（一般都是负值）
• 移动的距离就是这个目标图片的x和y坐标

.box1 {
    width: 60px;
    height:60px;
    margin:100px auto;
    background: url(images/sprites.png)
    background-position: -182px 0;
}