移动设备上的背景图片太小。怎么修？

Question

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

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

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

任何建议都将不胜感激。

Answer 1

它试图保持它的纵横比，你可以将高度设置为100％并让它破坏纵横比或者只是淡出图像的底部，使它看起来融合在一起。

Answer 2

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