结合使用Sass和Gulp的背景图片路径

Question

我的背景图片未加载！ 我在stackoverflow上搜索了一个解决方案，但发现的内容无法解决我的特定问题。

我使用GULP作为构建工具，使用GULP SASS编译器进行SASS编译，使用GULP BROWSER-SYNC作为测试服务器。

我的html

<section class="img_header">
 <div class="text_img_header_centered">
  <h1>blabla</h1> 
  <h2>blablablabla</h2>
</div>
</section>

我的CSS：

.img_header {
  background-image: url('/assets/img/flugzeug_375x667.jpg');
}

那是我的文件结构。文件夹css中的main.css。 img中的blabla.jpg（如图所示）。我的main.scss在开发文件夹中。网站尚未在线。但是背景图片未加载！有任何想法吗？此项目中仅包含一个css文件。其他所有属性都可以正常工作。

感谢您的帮助：）

Answer 1

我不太清楚缩进，但是我认为是这样的。

.img_header {
  background-image: url('../../../assets/img/flugzeug_375x667.jpg');
}

将来，您应该尝试使用公用文件夹，并使用Webpack之类的文件将其合并到构建中。如果您的文件是通过Internet提供的，也可以使用绝对路径。