CSS（html）背景图优化合并技术详解
CSS背景图合并的优化，包括图片本身的优化，多画面组合：CSS Sprites技术、分类合并等。图片本身的优化
图像质量要求和图像文件的大小决定了您使用的图片的格式，并且用较小的图片文件呈现更好的图像质量。
当图片颜色太丰富，没有透明度时，建议采用JPG格式，质量高。
当图像的颜色太过丰富，透明或半透明、阴影效果，建议使用IE6 PNG8和PNG24格式，退化（或不需要使用过滤器的情况下）。
当画面的颜色不太丰富，无论是透明的或没有，请用PNG8格式。在大多数情况下，建议使用这种格式。
当图片动画时，只使用GIF格式。
你可以使用这个工具来重新画一遍，但前提是，它不会影响颜色和透明度。
多个图片合并：CSS Sprites技术
单个图标之间的间隙必须被保留，并且间隙的大小取决于容器的大小和显示，这样做的好处是考虑到容错并提高图片的可维护性。
图标的排列也由容器的大小和显示确定。安排分为以下几类：水平排列（容器宽度的限制），垂直排列（容器高度有限），斜线（不限于高宽的容器布置）、左对齐（在容器的背景左右（容器）置于背景，横向排列（右）容器的水平、垂直布置（背景）容器背景垂直）。
合并后，图片的大小不能超过50K，和图片的大小之间的20k-50k。
为了保证许多修改过的图片质量，在PSD中保持PSD原始、修改和添加，最后输出PNG。
分类合并：
这不是最好的组合所有图标在一张图片，但下面的方法应该注意到除了图片的大小。
根据图片安排，合并同一排列的图像，以方便样式控制。
根据模块或组件，将属于模块或组件的图像合并，以方便模块或组件的维护。
根据图片的大小，合并相同大小或相同的图片，以充分利用图片空间。
根据图像的颜色，可以合并颜色的组合或类似的颜色，以确保合并图片的颜色不太丰富，并且可以防止颜色失真。
结合上述方法。