为使响应迅速，请将内容包装在div或flex容器中。 不要固定任何宽度或高度，并使其保持自动。

try和css选项：display：flex。

除了我的答案中建议的选项之外，您还可以使用bootstrap css类轻松处理图像。

https://www.w3schools.com/bootstrap/bootstrap_ref_css_images.asp

下面的CSS代码使图像响应。

 检查W3C链接：https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_image_sensitive


 <样式>
 。响应{
     宽度：100％;
     高度：自动；
 }
 
 
 <身体>
 
 
  

嗨，Sharath，

我确实尝试过，但是由于我将背景Image类应用于Page元素，因此无法正常工作。

我发现了另一种通过向应用程序添加" backgroundImage"来以响应方式显示背景图像的方法。

图像仍然存在问题，因为图像上包含嵌入式文本并且被截断了。 图像上还有一个按钮，其位置在各种移动设备上不断变化。 我正在使用" margin-top"属性（css）来维持其在屏幕上的位置。

以下是所有快照的链接：

原始图片

Galaxy s5横向模式

Galaxy s5纵向模式

ipad横向模式

ipad纵向模式

有人知道如何解决此问题吗？

感谢Sharath的努力。

尝试一下，

 .page2BgImg {
     背景图片：url（'../img/mainScr.jpg'）;
     背景重复：不重复；
     背景大小：包含；
     背景位置：中心；
 }