css:如果分辨率低于 1024 x 786，则在网站主背景图像的底部和右侧获取空白

Question

我正在为工作开发一个新网站，我对 CSS 很陌生。我创建了以下站点:

http://hewdenportal.co.uk/

问题是，当用户将他们的窗口调整到 1024 x 768 以下时，我在主背景图像的底部和右侧得到一个空白区域，我不想在那里，因为背景应该是设置为缩放 100% 宽度和高度。

谁能告诉我哪里出错了？

我的背景图片 CSS:

header .layer {
  width: 100%;
  height: 100%;
  background: rgba(24, 24, 24, 0.8);
}

Answer 1

更改 <header style="background-image: url('assets/images/header.png');至 <header id="background">

并添加以下属性:

#background {
    width: 100%;
    height: 100%;
    background-image: url('http://www.hewdenportal.co.uk/assets/images/header.png');
    background-size: cover;
    position: fixed;
}