文章/答案/技术大牛

发布

社区首页 >问答首页 >iPad / ios6不渲染png背景图像

问iPad / ios6不渲染png背景图像
EN

Stack Overflow用户

提问于 2012-09-24 15:53:59

回答 9查看 6.3K关注 0票数 7

在ios5上，网站加载正常，看起来也是正确的。

自从ios6以来，我网站的一个使用png图片作为背景的部分开始在iPad上渲染，但随后背景没有明显的原因就变成了黑色(注意所有其他部分保持正确的颜色)。

代码：

<section id="showcase">
    <section class="container">
    <img src="images/usp.jpg" alt="USP Screen" id="screen">

    <h2>title</h2>    

    <p>the text.</p>

    <p>The text.</p>
    </section></section>

CSS：

#showcase           { background: url(../images/showcasebg.png) repeat-x #ededed; height: 600px; position: relative; top: 87px; }
#showcase h2        { float: left; max-width: 422px; font-family: 'Lobster', cursive; font-size: 36px; margin-top: 20px; }
#showcase p         { float: left; max-width: 422px; margin-top: 20px; }

html

css

ipad

png

ios6

回答 9

Stack Overflow用户

发布于 2012-10-09 00:39:03

我在我们的一个网站上也遇到过这个问题。我有一个移动网站，使用背景PNG图像进行渐变，在iOS6 (Chrome和Safari应用程序)上显示为黑条。

我很容易修复他们通过重新保存的网络图像为

as 至少10px wide
将它们保存为non-interlaced PNG

这立即解决了我的问题。

票数 3

Stack Overflow用户

发布于 2012-09-26 06:18:24

我不确定这是否直接相关，但我昨晚遇到了类似的问题。我使用图像的相对网址，发现iOS6将图像路径中的空格编码为%2520而不是%20。这对我来说是一个问题，因为我在模拟器上的应用程序中查看web视图中的图像资源，因此模拟器提供的资源的路径中有空格。这在设备上不是问题，因为路径中没有空格。

我发现新的远程检查器(这里提到的：http://www.mobilexweb.com/blog/iphone-5-ios-6-html5-developers)在确定发生了什么事情方面非常有用。

票数 1

Stack Overflow用户

发布于 2012-11-22 12:28:10

我刚刚在网络服务器上遇到了这个问题。解决方案是将PNG从8位整数精度更改为32位。显然，iOS不能正确处理8位；我不知道16位。我认为Photoshop可能已经自动完成了这一点，因为图像的复杂性很低(一个简单的渐变)。在GIMP中很容易修复：Image -> Precision -> 32-bit integer

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/12560921

复制

相似问题

问iPad / ios6不渲染png背景图像
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问iPad / ios6不渲染png背景图像EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问iPad / ios6不渲染png背景图像
EN