浏览器窗口调整大小时如何避免背景图像平铺

Question

我在body标签内使用了实际图片作为背景图片，然后将其修复为actual site

的示例

当我在大屏幕上观看时，背景图片会像这样

我怎样才能使图像不会平铺并保持在实际网站中显示的“单个”。

我正在使用的 CSS 位于

之下

body {
margin:0; padding:0;
background: url(../images/new.jpg) fixed #A8BFAD;
 }

Answer 1

如果您希望图像保持实际尺寸：

body {
        background: url(../images/new.jpg) fixed #A8BFAD no-repeat;
    }

如果您希望图像填满屏幕：

body {
    background: url(../images/new.jpg) fixed #A8BFAD;
    background-size: cover;
}

Answer 2

在CSS

中将background-repeat:no-repeat;添加到body

body {
  margin:0; 
  padding:0;
  background: url(../images/new.jpg) fixed #A8BFAD;
  background-repeat:no-repeat;
}