html - CSS 背景图像限制为内容而不是整个页面

Question

因此，我为我的网站背景制作了一个渐变图像，由于它没有太多细节，我想我会使用图像并使用背景图像和 CSS 将其拉伸(stretch)到页面上。但是，图像拒绝以正确的方式垂直拉伸(stretch)。我可以让它很好地水平拉伸(stretch)，但无论我做什么，它都不会在页面上垂直拉伸(stretch)到 100%，而是将自己限制在页面上的内容，这是我不想要的。我可以让图片水平拉伸(stretch)而不固定像素长度的唯一方法是使用封面，但它变得太高了。谁能给我一段代码，我可以用它来扩展图像以在水平和垂直方向上适合页面？因为它拒绝而且我不知道为什么

这是我头部样式标签中的 CSS 代码

body {  
    background: url('Background.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

Answer 1

对于初学者，background-repeat 设置为 no-repeat。

你需要让 body 填充浏览器，无论它包含多少内容，否则它只会重复到内容为止。

编辑:

无论内容是什么，都让页面充满浏览器。

html, body { height: 100%;}