我的图片都没有显示

Question

我正在使用 Jekyll 创建一个简单的网站。我试图通过 CSS background-image 属性在英雄部分放置背景图像，但图像不会加载。我通过尝试使用该元素将图像直接上传到 HTML 中测试了不同的图像，但也不会加载。这让我怀疑路径是否错误，但我似乎无法在我的目录结构或代码中找到错误。我在 firebug 中进行了测试，发现错误是“无法加载给定的 url”。我所有的图像都位于我项目的“图像”文件夹中，我复制并粘贴了实际名称以确保我没有输入错误。这是一些相关的代码。

本节项目中的文件夹结构：

_scss (folder)
  1-tools (folder)
  2-modules (folder)
    hero.scss (scss file being edited)
  3-layouts (folder)
  images (folder)
    hero.jpg (file being called)

.hero-section {
  background: url(../images/hero.jpg) no-repeat center center;
  background-size: cover;
  height: 100vh;
  width: 100vw;
}

<div class="hero-section">
  <!-- background image fills the div -->
  <div class="hero-text">
    <h2>Header</h2>
    <div class="hero-talk">
      <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h3>
    </div>
  </div>
</div>

如果有人能指出我可能做错了什么，那将不胜感激！谢谢

Answer 1

我解决了这个问题。我认为这是 Jekyll 特有的。由于我的所有样式都被发送到另一个文件夹中的外部 CSS 文件，因此在最后一分钟找不到图像。我只是将图像文件夹移到 _scss 文件夹之外，以便在最后一分钟将所有内容推送到最终的 css 文件时路径是正确的。