CSS问题：背景比屏幕高答案

【问题标题】：CSS issue: background taller than screenCSS问题：背景比屏幕高
【发布时间】：2017-12-24 07:42:08
【问题描述】：

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

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

这是 CSS 中的代码：

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

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

感谢您的帮助。

【问题讨论】：

CSS Image size, how to fill, not stretch?的可能重复
没有代码，没人帮你
如果您与我们分享自己的代码，我们会尽力帮助您
background-size: cover; 样式完全符合您的要求。如果你得到不同的结果，你必须展示它发生的代码示例。

标签： css image background size cover

【解决方案1】：

我解决了我的问题。

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

background-size: cover;

在 CSS 文件中。

所以我刚刚添加了

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

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

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

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

问候，
巴斯蒂安。

【讨论】：