如何拥有不放大的全屏背景

Question

我对html和css相当陌生，所以如果这是一个愚蠢的问题，我很抱歉。现在我有一个背景图像，我覆盖了整个页面。问题是，有时当我尝试放大其他图像或视频时，背景会无缘无故地"放大"。

body {
background-image: url("img/background.png");
background-repeat: no-repeat;
background-size: cover;
width: 100%;
min-height: 100vh;
}

这就是我现在在 css 中拥有的。任何和所有的帮助将不胜感激

Answer 1

欢迎来到StackOverflow！ =D 因此，在一个网站中，我也有一个固定的图像背景，并且使用以下代码使图片适合背景：

background-image: url('img/background.jpg');
position: fixed;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center center;

我不确定它是否适用于您的代码，但如果说实话，我认为这将是您需要的解决方案。

顺便说一句，PNG 文件很大，因此可能会导致您的网站加载时间变慢，我去过那里，所以我建议您改用 JPG 文件。