适用于 iPad、iPhone 的背景（封面）答案

【问题标题】：Background (cover) for iPad, iPhone适用于 iPad、iPhone 的背景（封面）
【发布时间】：2013-05-07 08:20:33
【问题描述】：

我遇到了几种关于 ipad 和 iphone 尺寸以及如何使用不同 css 的方法和问题。真的有必要吗，尤其是现在有了更多版本的 ipad 和 iphone 来为每台设备设置不同的背景？

几乎每个关于这个问题的答案/网站都告诉用户为 iPad 使用 1024 分辨率，但根据 Apple 的网站，最新的 iPad 的分辨率为 2048 x 1536 像素？

那么我需要为 iPad 2（或其他）制作一个宽度为 1024 的背景，然后为 iPad 3 制作一个宽度为 2048 的背景，为 iPhone 制作另一个等，还是有更简单的解决方案？我认为“背景尺寸：封面”将是每种分辨率的解决方案（因为它会自动缩放），但显然不是，因为它似乎不适用于 iPad。

【问题讨论】：

标签： css ipad

【解决方案1】：

所以我需要为 iPad 2 制作一个宽度为 1024 的背景（或不管怎样），然后是 2048 用于 iPad 3，另一个用于 iPhone 等

没有。尽管设备分辨率不同，但在使用 CSS 定位它们方面，它们仍然遵循原始数字。所以所有的 iPad 都响应 device-width: 1024px，而 iPhone 仍然坚持使用 320px，即使它们现在包含更多像素。

唯一需要注意的是 iPhone5 稍高一些，因此它响应 320 x 560 像素。

无论如何，就background-size而言，所有这些都无关紧要，因为它的全部意义在于，如果您使用background-size: cover，它可以适当地调整图像大小以覆盖任何屏幕。

【讨论】：

是的。您是否有一个似乎失败的测试用例？还是您使用的是旧 iPad？
@ralphm 我正在浏览器堆栈上进行测试。更正：如果您尝试 cover 为元素而不是 html 页面的背景，它会占用整个屏幕的宽度和高度，而不是元素的宽度和高度。
嗯，这不是我发现的。随意发布我们可以测试的 Fiddle 或 CodePen 示例。