0

我最近遇到了一些网站，他们的网站资产（徽标、资源图片）如下所示： 

background: url("data:image/gif;base64,R0lGODlhbAAbAMQAADRNU////8PAvwCq3KunpYeCf+fm5RSGp3BpZgDW7tvZ2WRdWaCbmVhQTRSltPPy8re0sszMzHt1cgDs9xTBwJOOjBCNsgC/5TRZWBDOzd7e1vf39xCduYiCgEA3MwAAACH5BAEHAB4ALAAAAABsABsAAAX/oCeKDaEEaGBA0ui+cCzPdG3fM5HuqYHgQBtvNAzCeClZ44REdozQV9EzjVKbMl2zubBGp9UvFtZAKgiQCBLihYJ37SsyxuD9RgheJB58J9tbMWopbC55O3t8gHCKYSKDKAwvDQ87kopejlaakCoNLwsGKASYi398mlo9LUANDBGVKixHcx4VTAoMn3IoRFsBChW7SgSivzELTQbCNqpIBqwiTUtr0oy8Ww9PMc7HMQK  /AndkTL8B29go5UV+5gGXLhDup5PrSBHjI90BEcY7u  /N6WDsVEAU6D3UK0tjHg9SIMjsI7JLQ0EWTfpYG9tLo7sEuSgUD1Ggg71chD84E/7igiMgijwoeGoBb5ovgtQYSOr0TUYGHAgldON5oUMGfHRHrhnlgSchlCngx2ol8YdTAox0epVy7saDkDpW8FMBYl0+T043YYCT8EwvFyZpoXWhRcFAEgrYbW05KEyGaUBpSYRz6wwPqXxdrgcXowC6FWCBm4U5N+6Ino4paUTwYq2nwxnVBb0Q+7MirCqQ7HjtVoJTjZBeW/zhjjWM05dsiku0oZDqA3ytZMVDIQAGDB6P8JOxakDgAWM8BHhDIJ8N24BEd8Aa4wxgrM2ukMEwYPx5D83nodHpLt5X95JBgRSBv8sNBgvv3HVArmIiE9kCutQege0hkNQJTv/zAwV8FDDLIQUzqNUGbC6HMI1kYAwb0QGgjxLbFDwcMIKKIB4xQwHwRKdFbLQS+5t6F97SG3X9PeQDAiCIC8IIEBEBigADfzUCUACjCSM+LAWomQF1kVIAREjABcIAFB+gYAgA7") no-repeat scroll 0 0 transparent;

这怎么可能？以及我们如何在我们的网站中进行这种编码？

编辑
在这一点上我不是很好，如果可能的话，请多帮忙以获得答案，我对我的图片进行了编码，得到的代码太长了大约 2 页，现在我在 css 中添加了它但没有成功！ ！（顺便说一句，这有助于提高性能吗？）

4

2 回答 2

0

如上所述，它不是加密而是编码；基本上，它与您通常引用的外部嵌入到 css 中的资源相同。您可以尝试自己制作或使用在线提供的众多工具之一；wiki 文章也非常详尽。

虽然它不提供任何内容保护（即任何人仍然可以保存文件），但如果使用得当，它确实提供了一些好处。主要的一个是更少的 http 请求——而不是请求每个单独的图像资源，它们已经全部下载了！只是不要将您网站的所有图形转储到 css 文件中，而是坚持使用几乎每个页面上使用的元素。

IMO，另一个很大的好处是更容易的资源管理。您可以有效地对单个图形文件进行操作（没有背景出血伪影等），而不是精灵小图标 - 但您不会因此而受到显着文件大小开销的惩罚（建议在启用 gzip 的情况下低至 3%）。

基本上除了IE7之外的所有浏览器都在一定程度上支持该方法。关于内容类型/大小还有一些进一步的限制（例如 IE8 最大 32kb）

于 2012-04-15T03:33:51.610 回答
-1

图像源只是使用 BASE-64 编码。它更快。如果你想解码这个使用例如http://www.motobit.com/util/base64-decoder-encoder.asp并选择导出到.bin文件。比保存，将扩展名更改为 .gif 和瞧。:)

正如我所写的那样，它更快，但在我看来不太方便。

于 2012-04-15T03:21:23.887 回答