CSS中的背景图片不适用于移动设备

Question

我是HTML / CSS的新手，并尝试通过制作一些基本站点来进行练习。

我的网站的桌面版本看起来不错，而当我在Chrome浏览器中查看它时，移动版本看起来不错，但是当我实际使用移动设备时，图像并没有为视口调整大小。通过尝试修复它，我一直在进一步完善它，因此，我非常感谢您的帮助。

我尝试搜索此问题，但是找到的解决方案告诉我使用background-size: cover，这是我已经在做的事情。我尝试将正文更改为body {width: 100vw; height: 100vh;}，还尝试将the advice here更改为height: 90vh，并保留背景覆盖和宽度，但这将其减小为div线的大小，这也是小。我觉得this solution here with media queries很近，但我不知道。

Here is the repo和here is the GitHub page，您可以在其中查看它们。先感谢您！

桌面：

检查器：

手机：

Answer 1

尝试放置background-position:center center; 无论如何，要保持固定的背景，这会导致移动设备性能出现巨大问题