iOS背景 Sprite 不显示

Question

我手上有一个棘手的小 bug 。

考虑 this page . images that accompany the paragraphs都是从 Sprite 调用的，随着视口(viewport)缩小，不同的背景位置被调用以适应响应式设计中的各种布局。

在浏览器测试中，除了 IE<9… 和 iOS 之外，所有 View /设备都没有为所有设备/浏览器提供严重的错误。 (accompanying inspector view)。似乎出于某种原因，iOS 设备(相同的 View /宽度在桌面上正确显示)没有在这些 div 中显示任何内容。 Inspector 没有抛出任何错误，网络计时器显示 Sprite 确实加载了。

为了加深情节，如果我调用直接 URL，我可以在 iOS Safari 中加载 Sprite 。所有图像 Assets 的 Perms 都设置为 755，我尝试使用各种 dom 元素(div、span、p、i)和背景技术(即在   中包含一个 <div>，声明 content: '';，反之content: ' '; );

我已经在 Mac/Win Chrome/Firefox/Safari、Android 设备、iPhone4/5 和 iPad (iOS6) 上对此进行了测试。不显示(至少在我的硬件上)背景 div 的设备是 iPhone 和 iPad。

有人对此有深入的了解吗？

Answer 1

移动版 Safari 中存在一个错误，导致总分辨率大于 2,000,000 像素的 CSS 背景图像根本不显示。 blog post from 2010对此进行了深入探讨。据我所知，它从未得到纠正。要显示背景图片，您需要将其缩小(以总像素计)或将其分成两个或多个 Sprite 。我以前肯定见过这种情况；唯一的解决办法是缩小图像。不是文件大小，以像素为单位。