如何制作并使用css精灵图/css sprites？
一，什么是css精灵图？
引用百度百科的原话，CSS Sprites在国内很多人叫css精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去。
二，为什么要使用css精灵图？
使用css精灵图主要有两点好处；
1.让小图（小图标），既请求一次大图，得到所有小图实现一次请求，减少对服务器的请求速度，避免网页造成延迟。
2.方便对小图（小图标）的管理。
三，如何制作并使用css精灵图？
主要分为两部分：
1.使用ps制作精灵图；
步骤演示:
新建一个透明的图层。
图1
使用alt+鼠标滚动键，放大图层。
新建参考线；
图2
在实际测量小图大致宽高后，就开始建立参考线。比如，我的小图大致为25px*25px（宽高不超过25px*25px）。所以，我在参考线取向上水平方向建立了3条参考线（25像素、50像素、75像素）；垂直方向建立了3条参考线（25像素、50像素、75像素）。
图3
依次放入各个小图（小图标）；
图4
2.使用css和html代码显示精灵图的各个小图。
步骤演示：
2-1.引入图片；（红色框内为主要代码）
图5
代码如下：
.jlt {
background-image: url(../images/jlt.png);
background-repeat: no-r...
查看详细
