SCSS / CSS背景图片网址路径问题

Question

我有一个SCSS项目，我需要在div上使用background-image属性，但是找不到图像。 （CSS已正确链接）。这是我的SCSS代码：

.coffee-icon {
    background-image: url('./../img/coffee.png') no-repeat;
    width: 400px;
    height: 400px;
    background-size:cover;
}

这是文件夹结构：

最后有一些注释：它不能与“”或引号一起使用，而且我很确定这是路径问题，我只是不知道这是什么问题。

Answer 1

在理想情况下，您的URL路径应该是绝对的，因此请始终以/引用域的基本路径开头。

您有：

background-image: url('./../img/coffee.png') no-repeat;

您应该寻找的形状是：

 background-image: url('/folder/img/coffee.png') no-repeat;
                        ^ This lead slash references the base path of the domain.

因此，上面的示例是domain.com/folder/img/coffee.png-您看到前导/是整个URL的基础。

这样做的好处是您可以将SCSS或CSS或图像文件放置在域结构中的任何位置。

绝对路径是成功的关键！

示例2：

 background-image: url('/images/tea.png') no-repeat;

图片位于：

 mydomain.org/images/tea.png 

SCSS或CSS文件的位置并不重要，只要它在同一域中即可。

Answer 2

好吧，我刚刚弄清楚了，只为将来的其他人使用了/img/blabla.png 显然将其设置为从根目录开始。