透明图像可能的最小数据URI图像

Question

我正在使用带有背景图像的透明1x1图像，以便能够使用精灵并仍为某些图标提供替代文本。

我想为图像使用数据URI来减少HTTP请求的数量，但是 产生透明图像的最小字符串是 什么？

我意识到我可以使用数据URI：s代替实际的图片，但将所有内容保存在CSS中而不是分散放置时，维护起来会更容易。

Answer 1

在使用不同的透明GIF玩耍后，有些不稳定并会导致CSS故障。例如，如果您有一个<img>并且使用了最小的透明GIF，它可以正常工作，但是，如果您希望透明GIF具有一个background-image，那么这是不可能的。由于某些原因，某些GIF（例如以下代码）会阻止CSS背景（在某些浏览器中）。

较短（但不稳定-74字节）

data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==

我建议使用稍长且更稳定的版本，如下所示：

⇊稳定⇊（但稍长-78个字节）

data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7

另一个提示是，不要遗漏image/gif一个评论。这将在多个浏览器中中断。