Question

横幅没有显示背景图片，但是我很确定我的代码是正确的。

我正在尝试将背景图像作为横幅广告放置在索引页面上，该页面顶部将显示文本。我正在关注YouTube上的一个教程（很抱歉，我知道），我很确定自己已经完全遵循了示例代码（最终将对其进行更改，但我只想提供参考）。

<main>
  <section class="index-banner">
    <h2>FILM. MODELING.<br>DESIGN.</h2>
    <h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque tellus velit, blandit ut nisi in.</h1>
  </section>
</main>

.index-banner {
  width: 100%;
  height: 100vh;
  background-image: url('img/tom.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

我应该在<h1>和<h2>标签后面得到一张背景图片，但是什么也没看到。我尝试删除格式，但仍未对其进行排序。

Answer 1

我发现问题实际上出在meta标签中。我在哪里...

<meta name="viewport" content="width=device-width, initial-scale=1.0 ">

... 1.0后面的空格仍在“”中。这显然造成了图像问题。

为什么背景图片没有显示？

1 个答案: