解决 PNG 图片在 IE6 下的偏色问题

最近又在搞 Our7,IE6 又出来烦人了——刚刚做完的评论界面在 IE6 下一塌糊涂。我只好一个一个调整,原来 IE6 不支持“>”的 CSS 语法,我只好用另一个逻辑改写 CSS。

对于 IE6 经典的 PNG 不透明问题,一般的办法是用 Hack 文件——反正似乎都是些难懂的技术。毕竟 IE6 对 8 位以下的 PNG 透明还是支持的,那就干脆把 PNG 做成 8 位的,然后用 _background 给 IE6 设到 8 位文件去,其它浏览器照用原来的文件,要不图片的品质都给 IE6 搞坏了。

这个还算简单,可我又杯具地发现,在 IE6 下用一些 PNG 图片做背景,跟旁边同样颜色(#AABBCC)的区域一比,居然偏色。

@sofish 写了篇《打败 IE 的葵花宝典:CSS Bug Table》,一查,第15条“PNG图片中的颜色和背景颜色的值相同,但显示不同”,解决办法是“利用 pngcrush 去除图片中的 Gamma profiles”,下载下来,打开压缩包,看到一堆不认识的文件。后来我才知道,这是 C 脚本。本人对程序编程用的语言一窍不通,我还真不知道该怎么办了。

Google "Gamma profiles",出来一堆无关网页。我突然想到,上次电脑玩物说过一款图片压缩软件 Riot ,试试?经过多轮调节设置,我终于摸索出用 Riot 处理这个问题的办法。

1. 下载好 Riot 并打开,先备份一份 PNG,然后把 PNG 拖进软件界面。

2. 注意图片下面第一行选到 PNG 格式,然后 PNG Options 选项卡里 Color reduction 选择 Optimal 16 Colors Palette(当然,其他选项也许也能搞定,不过 True Color 肯定不行),其他选项保持不变。

3. 如果 PNG 图片有透明区域,打开 Mask 选项卡,选择 Keep transparency。

4. 这样基本上就没问题了。按下 Ctrl+S。因为前面已经备份了,不怕失败,直接覆盖(Enter)就行。

5. 上传,打开 IE6(或刷新),看效果。

如果出了啥问题,慢慢调设置试试看就行了,当然最好留言告诉我一声。最后,感谢总结 IE 奇怪问题的人,鄙视还在用 IE6 让不少人受罪的人。

---

PS:恢复放假几天来,我 @phy 根本没心思写作业(约等于学习),完了完了,初三怎么办。连班事日记也都拖了4天了。