Question

我想添加一个不透明度设置为不透明度的背景图像：0.2;到我网站的主体。我的标题中已经有一个背景图像，但每次尝试在页眉和页脚之间添加一个背景图像只会将内容向下推到页面上，我的主体内容会被推入页脚区域。

我是新来的，所以任何帮助都会很棒。如果有必要，我愿意在这里发布我的代码。

这是我的代码

.background-img {
  background-image: url(img/background-scott.png);
  background-size: cover;
  background-position: left;
  opacity: .2;
  background-repeat: no-repeat;
  height: 100vh;
  margin: 0;
  padding: 0;
}

上面的类设置为主div，概述了整个代码段。 section标签具有相同的效果......

谢谢

Answer 1

您可以将该背景图像添加到正文或任何标题父级的容器中。

＆＃13;

body {
  background-image: url(http://via.placeholder.com/800x400);
  background-size: cover;
  background-position: left;
  opacity: .2;
  background-repeat: no-repeat;
  height: 100vh;
  margin: 0;
  padding: 0;
}

header {
  background-image: url(http://lorempixel.com/400/200/);
  background-size: cover;
  height: 30vh;
  width: 100vw;
}

＆＃13;

<body>

<header></header>

</body>

＆＃13;

是否可以在标题背景图像下将图像添加到背景中？

1 个答案: