如何根据窗口大小和设备调整css背景图像比例

我正在尝试设置一个流体模板，也可以用于响应性设计视口。然而，现在当我尝试调整浏览器窗口的大小时，它不会缩放，在我的iphone上，我只看到标题图形的左上部分。我有一个主包装背景和一个标题动画gif，两者的宽度都是1200px。任何帮助都将不胜感激

视区

<meta name="viewport" content="width=device-width, initial-scale=1">

---

尝试按以下方式使用背景大小属性：

背景尺寸：100%自动

如果你想让它的高度覆盖整个页面的高度，也可以使用下面的选项

背景尺寸：自动100%

对我来说很好

background-image: url('');
background: no-repeat center center cover;

---

这通常很好。

您是否尝试过通过媒体查询向手机提供不同的图像？同样的图像会完美地填充1400px宽的笔记本电脑屏幕和320px的iphone屏幕，这是不现实的。这是一个如此快速简单的解决方案！谢谢你，帮了我这么多！

background-size: cover;

background-image: url('');
background: no-repeat center center cover;