雪碧图的制做

雪碧图，又称精灵图，利用其定位来肯定咱们须要采用的图片。  

使用方面，大大的减小了请求次数，提升了效率。

合并雪碧图，须要将全部的图片的宽高设置成同样的。而后利用其在X、Y轴的位置来肯定图片。

举例说明：

这个是一张高宽都同样的图片   

 

利用定位（注意雪碧图是使用它的背景定位作的）

具体操做步骤以下：

在css样式中：

而后出现的咱们须要的图片：

 

 

 

你们能够到一些大型网站去看看，不少小图标，icon都是经过一张雪碧图来实现的。好比你们能够去参谋下淘宝网等。