css雪碧-PHP实现Sprite图像制作

什么是 css 精灵

CSS sprite在国外被很多人称为css sprite，是一种处理网页图像应用的方法。 它可以让你将一个页面涉及到的零星图片全部包含到一张大图片中，这样当你访问该页面时，加载的图片就不会像以前那样一张一张地逐渐显示出来。为什么要用这个工具

1.加快网页加载速度

浏览器同时接受的请求数为10个，如果图片太多，会影响整体的视觉效果，而且对于不稳定的网络带宽来说，加载起来将是一场噩梦，所以将图片拼接成一张大图片促进加载。 速度，并加速页面渲染

2、后期维护简单

该工具可以通过选择图片直接拼接图片。 当然，你也可以自己移动上面的图片，自己布局你的精灵图片，直接生成代码，简单易用

3. 开源

该程序早已开源在github上css雪碧，地址：csdn下载地址

百度云盘下载

如何使用

1.使用ps或者dw剪切出需要的图片

2.打开CssSprite.exe

打开CssSprite.exe文件，我将下载地址放在下面一点

3.打开图片

点击左上角按钮打开图片

选择多张图片并单击“打开”按钮

4.整理图片

明天你可以选择前面按钮的默认布局，也可以用键盘选择图片的位置进行拖动。 拖动完成后，程序会根据内部图片的位置生成面积最小的精灵图片。 当然，相应的图片位置也会发生变化。

5. 代码生成

程序中可以生成sass代码和css代码css雪碧，根据自己的需求，自行选择，当选择“是否是移动端”时，所有规格都会乘以2，因为移动端往往有比较大的设计，所以要缩放，建议生成图片，然后复制生成的代码

6.保存精灵图

点击“生成精灵图”按钮，程序会默认选择你在步骤3中打开图片的地址，然后点击确定即可生成精灵图。