CSS图像优化的相关建议

本文主要介绍了一些相关的建议，对CSS图像优化，主要为精灵图像融合技术作一简要介绍，需要的朋友参考。
CSS图像优化压缩图片的大小尽可能加快页面加载，这对于大型网站是很有用的。别小看它，它可以大大提高页面的加载速度。常用的方法是CSS Sprites。

CSS Sprites的目的是通过整合图片，减少对服务器的请求数量，使页面加载速度的加快，我想很多人已经使用这种技术。我将简要介绍一下我使用CSS精灵时所使用的一些技巧。
CSS Sprites实现方法：

首先，将小图片集成到大图片中，然后根据大图片上特定图标的位置将背景固定到背景中。
CSS Sprites技术要点总结：

1。小图片整合，按照从上到下的顺序，而不是一个图片一个图片从左到右。这种安排背景位置一目了然，这是写CSS容易多了。同时，它也为以后的维护。想象一下，如果我们改变在以后的维护一个图片的大小，然后所有元素周围会改变背景的位置，这将是一个头痛的问题。

2。小图片整合到左或右。这两个位置非常灵活，放置图标在文本非常适合，然后写作风格不受其他CSS Sprites图片。首先，我们可以沿着左侧和右侧自上而下的一体化启动画面。

三.不建议在不同的小图片上保持间隔，这样会增加图片的大小以增加文件的大小。

4。图片中相近或相同颜色的组合可以减少颜色的数量，因为图片文件的数量较少，颜色相对较少。
图像优化：

当我们把所有的小图片组合成一幅大图片时，我们应该开始考虑图像优化的问题，你可以看看图片的文件大小。

因为大图片背景的一般集成基本上都是透明的，所以我们将保存为PNG格式，您可以说GIF小于PNG文件。我们不想优化它吗为什么不是GIF呢因为一个GIF图片会在一个角落里像曲线有很多牙齿，或削减，这是我们不愿意看到的。它可能会失去一些小图片的像素，接近白色。除此之外，我们还可以找到一个比GIF更小的尺寸，这是我想介绍一下今天的PNG8格式。

对于非动画的GIF，建议用PNG8是因为它可以实现与原始PNG图片一样的效果，它可以节省10%～30%的文件大小甚至保存GIF图像。
如何把图片转化为PNG8格式

1。图片的准备：无论什么绘图软件你是画，只是把它保存为PNG格式的正常运行。PS图象处理软件没有PNG8的操作，所以我们需要把烟花。

2。打开烟花集成大图片。

三.选择文件mdash；图像预览。

4。在格式；；下拉框中选择PNG8格式，没有别的选择，直接点击导出按钮；；路径选择是好的。

要在你的PNG8图片的大小看，与以前的照片比较是很容易的。你会有一个惊喜！看图片质量，很完美~