CSS Sprites 或 CSS Gaga
准备要合成CSS雪碧图CSS Sprites的图片。合成到同一张CSS雪碧图（CSS Sprites）的子图最好分辨率相同，否则容易导致图片失真，如下图中的子图分辨率都是“32×32”的。
配置CSS Gaga选项。①在“图片合成”选项卡中调整所合成CSS雪碧图（CSS Sprites）目标图的各成员图的大小，有“png8”和“png32”两种尺寸。②“代码格式”中各部分含义如下： “%filename%”：子图名称 “%width%”：子图宽度 “%height%”：子图高度 “%x%”：子图左上角的X坐标 “%y%”：子图左上角的Y坐标
拖入CSS Gaga图片合成工作区。选定所有需要合成CSS雪碧图（CSS Sprites）的子图，拖进CSS Gaga“图片合成”工作区。
找到生成的CSS雪碧图（CSS Sprites）。生成的CSS雪碧图默认在桌面上的“CSS Gaga”文件夹，里面的“CssGaga.png”就是我们要找的CSS雪碧图文件，可以将其移动到需要的地方，并改成自定义的名称。
找到生成的CSS雪碧图（CSS Sprites）子图坐标。有两种方式可以找到CSS雪碧图（CSS Sprites）的子图坐标：①CSS Gaga工作区；②CSS Gaga工作目录内的“CssGaga.png.txt”文件。
在代码中按位置引用CSS雪碧图（CSS Gaga）。①CSS中给“class”选择器的样式为“background: url(css-sprites.png)”；②给“id”选择器的样式为“background-position: x y”。如果你还想学习更多关于编程的知识，可以参考下面的教程：
CSS雪碧图CSS Gaga的合成制作最好在子图定稿之后，否则频繁改动的时间成本很高