Question

我不知道为什么我的背景图片没有显示。我无法在开发工具中看到图像，而且我很难过。它位于文件夹中并指向正确的文件夹。任何帮助表示赞赏！这是我的代码：

HTML：

 <body>
<div class="l-head-backImage"></div>

<div class="container">
    <header>
        <h1>This is the Header</h1>
    </header>
</div><!-- container -->

的CSS：

  .l-head-backImage {
background: url(../images/Seattle.svg) no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
 }

Answer 1

你告诉它要覆盖div;但是，div没有实际大小，因为它没有内容。因此，您需要指定div的宽度和高度，以便图像实际上有一些内容可以覆盖。

您的代码示例和随机狗图片：JS Fiddle

CSS

 .l-head-backImage {
     background: url(../images/Seattle.svg) no-repeat center center fixed;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover;
     height: 300px;
     width: 300px;
  }

背景图像作为固定的背景

1 个答案: