Css Sprite，有时也称为雪碧图、精灵图，是每一个前端开都会遇到的问题，也是常见的小图片加载优化手段。相信各位同学都清楚其原理，具体就不赘述了。

之前一直有动机利用html5实现一个合成雪碧图的工具，方便小项目的快速开发，减少一些诸如开photoshop、fireworks等工具来合图的机械劳动，最近终于抽出时间将构思实现。

• 在线使用地址：http://alloyteam.github.com/gopng
• github地址：https://github.com/AlloyTeam/gopng

Go!Png介绍：

目前实现的功能如下：

1. 支持图片文件拖拽
2. 支持生成png图片与css文件
3. 支持两种自动排列的模式
4. 放大镜功能
5. 磁力吸附对齐功能
6. 工作状态导出功能，可以方便导出文件，在下一次操作通过拖放改文件来恢复工作状态（包括图片数据跟参数设置）
7. 支持Mac（Chrome） ：）

使用说明：

1.拖拽图片小文件到操作区域，如下图：

2.输入类属性设置与目标图片、css文件生成，如下图

3.生成的css文件是可以通过改变css模版来定制的

4.生成目标图片、css后可以直接下载

5.工作状态导出