background-size: 100% 100% 上传后不起作用答案

【问题标题】：background-size: 100% 100% doesn't work after uploadingbackground-size: 100% 100% 上传后不起作用
【发布时间】：2021-05-15 23:54:41
【问题描述】：

我有一个 Django 站点，当我在本地机器上运行它时，一切都很好，但是当我访问 pythonanywhere.com 时，出现了一个小问题：不知何故，我的背景图像不想填满整个页面，即使它在我的本地主机上（使用相同的浏览器，所以问题不在这里）。基本上我不介意改变纵横比，我只希望背景的每个像素都完全在屏幕上，是 600x400 还是 200x2000。

body {
    background: url("images/classes.jpg") no-repeat center center fixed;
    background-size: 100% 100%;
}

在我看来 {background-size: 100% 100%} 只是...不起作用？
我试图将百分比切换为100vw 100vh，但输出实际上是相同的。

页面本身：http://seltsamermann.pythonanywhere.com/classes/
图片本身：https://i.ibb.co/0G86wL2/classes.jpg

我想知道可能是什么问题。

（以防万一）
https://github.com/Seltsamermann/Specs-SL-PvP/blob/master/main/templates/main/classes.html
https://github.com/Seltsamermann/Specs-SL-PvP/blob/master/main/static/main/style_classes.css

【问题讨论】：

这看起来对我有用。您确定您的浏览器没有缓存旧版本吗？
您的意思是当您打开页面链接时，您可能会看到整个图片，而不仅仅是其中的一部分，就好像它“覆盖”了屏幕一样？如果是，那有点奇怪，因为实际上我之前想到了这个并尝试了另一个浏览器但得到了相同的结果。

标签： html django background-size

【解决方案1】：

object-fit CSS 属性设置如何调整被替换元素的内容，例如<img> 或<video>，以适应其容器。将此属性用于您的 css 中的图像或存储该图像的容器。

object-fit: cover;

试试这个：

body {
  background: url("") no-repeat center center fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

【讨论】：

感谢您的回答！可悲的是它对我不起作用，或者我只是误解了你。我的“图像”是 HTML 块的背景，所以我将 object-fit: fill; 添加到 CSS 的 body {} 部分（因为我实际上需要“填充”而不是“覆盖”），但没有改变了。
我已经编辑了我的答案，这在我的本地机器上对我有用，我希望它在上传后也能工作。并从 HTML 中删除，只留下 css 背景。
试过了；也可以在我的本地机器上工作，但是上传后为什么不能。 :(

【解决方案2】：

嗯，基本上我只是在发挥自己的能力；真正的问题是版本控制，我只是错过了几件事。主帖中的代码运行良好。

【讨论】：