背景不会显示答案

【问题标题】：Background won't display背景不会显示
【发布时间】：2015-11-02 05:32:07
【问题描述】：

所以我从 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>

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

【问题讨论】：

在您的 CSS 中，您将背景图片应用到 body，但在您作为潜在问题发布的 HTML 中，您没有正文标签...

标签： html css image background

【解决方案1】：

我刚刚测试了你的代码，它工作正常，所以我认为发生的事情是你的背景图片的路径是错误的。

如果您的星球大战图像不在您的 html 页面的根文件夹中，则它不能是 url("starwars.jpg");。检查你是否没有把它放在另一个文件夹左右。

【讨论】：

是的，在 Codepen 上。我刚刚在google上随便挑了一张图片的url，替换成background-image: url("...");就可以了。
刚刚将“starwars.jpg”替换为图片的url。工作正常！感谢您的回复！

【解决方案2】：

图像“starwars.jpg”是否与使用它的 .html 文件位于同一文件夹中？

【讨论】：

刚刚将“starwars.jpg”替换为图片的url。工作正常！感谢您的回复！