Sprite PNG出现扭曲

时间:2015-04-09 17:50:29

标签: image google-chrome png sprite internet-explorer-11

我们在客户的网站上使用png / 8精灵。他报告说,他和公司的其他计算机上的图像看起来都是扭曲的。

以下是它的外观:

http://i.imgur.com/wfV7ReR.jpg

这是客户发给我们的打印屏幕:

http://i.imgur.com/sWKDYKU.jpg

我尝试过再次导出并再次导出,然后重新上传。问题是:在我们的计算机上它看起来很好,所以很难测试它。我们的客户在IE:11和Google Chrome浏览器中查看它:41.0.272.118。

之前有没有人见过这种类型的错误?

2 个答案:

答案 0 :(得分:0)

可能是设备像素比率优于160dpi;那会甩掉一些用于spriting的CSS。

如果这对你来说显示“1”并且它们的值不同,我会在那个上挖得更远。您可以通过使用iPhone或更新的Android设备访问该网站来测试这一点;它们具有> 1.0像素比率。

http://www.devicepixelratio.com/

编辑:这也会出现在各个浏览器的末端,因为它与硬件有关,而不是IE11。

答案 1 :(得分:0)

我在这种情况下的赌注是PNG在某种程度上被打破了。

graphicdesign.stackexchange.com可能更有用;我不知道这是否可以在CSS中修复。 (可能会在图像背景周围寻找黑客。)

环顾四周,如果您有Photoshop,可以尝试保存原始图像,然后创建副本并更改此设置:

Image -> Mode -> Check "RGB Color"

或者,尝试在pixlr.com中打开图像,稍微改变一下,然后保存并使用那个。

我强烈怀疑PNG / 8被保存的方式(可能是alpha通道)是问题,而不是你写的任何CSS。祝你好运!