CSS 问题：背景比屏幕高

Question

我正在制作一个网站，但我的背景有问题。我使用 {background-size: cover;} 让我的背景填满屏幕。但是当背景图片比屏幕高时，我们只能看到图片的一小部分。我想调整屏幕背景：我不想看到任何空白，但我想看到尽可能多的图像。我真的不知道要搜索什么，也找不到解决这个问题的答案。有没有人可以帮助我？

换句话说，我有多个背景可用。随机选择并显示一个。所以我希望背景完全适合屏幕，尽可能少地丢失图像。使用背景大小的封面，如果选择的图像是 UHD，例如，背景将只是与屏幕对应的左上角像素（对我来说是 1920x1080）。但我希望它适合屏幕的宽度或高度（更小，自适应）以显示几乎完整的图像。

这是 CSS 中的代码：

body {
    background: url('https://profuder.com/images/backgrounds/8.jpg');
    background-size: cover;
}

这张图片很大，所以我只看到了左上角。

感谢您的帮助。

Answer 1

我解决了我的问题。

我真的不知道为什么，但是我用来寻找随机背景的 JavaScript 删除了初始

background-size: cover;

在 CSS 文件中。

所以我刚刚添加了

document.body.style.backgroundSize = "cover";

在我的代码之后应用新的随机背景

document.body.style.background = "url('" + randomImage + "') no-repeat 0 0";

感谢您的帮助，抱歉缺少代码。

问候，
巴斯蒂安

CSS 问题：背景比屏幕高

CSS issue: background taller than screen

css

size

background

cover

image