html - 背景不显示

Question

因此，我从 codepen.io 获取了一个元素并对其进行了修改。但是现在我正在尝试添加背景图片，但无法显示它...这是我的代码:

body {
  background-image: url("starwars.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

div.window {
  color: white;
  width: 500px;
  padding: .42rem;
  border-radius: 5px;
  background: #26466D;
  margin: 1rem;
  text-align: center;
  font-family: BlueHighway, Arial Black, sans-serif;
  margin: 0 auto;
}
div.window label {
  display: block;
  background: #660b0b;
  font-size: larger;
  border-radius: 5px;
  padding: .6rem;
  transition: .4s all linear;
}
div.window label:hover {
  cursor: pointer; background: #311;
}
input.toggle ~ div {
  height: 0px; margin: .2rem;
  overflow: hidden;
  transition: .6s all cubic-bezier(0.730, -0.485, 0.145, 1.620)
}
input.toggle:checked ~ div { height: 230px; }
input.toggle:checked + label { background: red; }
input.toggle { display: none; }

<div style="height: 240px; padding-top: 1.2rem">
<div class="window">
<input type="checkbox" id="punch" class="toggle">
  <label for="punch">Use the Force, Luke.</label>
  <div>
    <img src="http://images.sequart.org/images/Star-Wars-still-use-the-force-luke-e1415132076759.jpg" style="max-width:100%;height:auto" alt="Ackbar">
  </div>
</div>
</div>

如果有人能找出我的背景图片不显示的原因，那就太好了!谢谢。

Answer 1

我刚刚测试了你的代码，它运行良好，所以我认为发生的事情是你的背景图片的路径是错误的。

如果您的 starwars 图片不在您的 html 页面的根文件夹中，那么它不能是 url("starwars.jpg");。检查您是否没有将它放在其他文件夹中。