html - 背景图像在移动设备上太小。怎么修？

Question

我有一个宽度设置为 100% 的 div，带有背景图像（如下图所示，背景图像是手持设备的手），因此调整窗口大小也会调整背景图像的大小。我这样做的目的是让它始终延伸到整个屏幕，无论您使用什么设备。

这工作正常，直到我在手机上启动该网站。手机屏幕水平太小，将背景图像缩小到屏幕底部的 3 个信息框 div 似乎被推开的程度，但它只是被拉起的背景图像：

有谁知道我该如何解决这个问题？我是否应该找到一种方法来定位信息框 div，使它们在屏幕较小时向上移动？

任何意见，将不胜感激。

Answer 1

它试图保持它的纵横比，您可以将高度设置为 100% 并让它破坏纵横比，或者只是淡出图像的底部以使其看起来融入其中。

Answer 2

您可能希望为不同的平台使用不同的背景图像，以实现向后兼容性，否则使用 CSS3 的background-size. 有关详细信息，请参阅http://www.w3schools.com/cssref/css3_pr_background-size.asp。