Question

我遇到了一个问题，我真的不知道是什么原因造成的。我在括号中工作，该网站在预览中完美运行。

然而，当我点击实际的index.html文件时，我的scss中的背景图像丢失了。

通过src上传的图片正在运行
我的其余部分正在工作
Js正在工作
只有我背景的图片（使用网址）不再有效，所以我认为它与网址有关。

scss的一个例子：

.jumbfirst {
    background: url('/imagini/images/background6.jpg');
    background-size: cover;
    width: $fullwidth;
    min-height: 600px;      
}

有什么想法吗？谢谢！

Answer 1

这取决于您的开发设置，这意味着您使用相对路径，但根据文件的结构以及您运行index.html的方式，浏览器会以不同方式读取路径。我猜双击index.html文件不会从本地服务器显示它，但作为绝对路径，如

文件：///Applications/XAMPP/xamppfiles/htdocs/devel/test/index.html

此示例来自MAC，它是文件系统中 index.html 的路径。

您应该拥有本地开发服务器（例如XAMPP），或者如果您已经将浏览器中的地址更改为

<强> http://localhost/devel/test/index.html

在这种情况下，我从devel / test /目录中的本地服务器调用 index.html 。

希望这有帮助。

Answer 2

这是因为与图像文件的路径相关性。说到域图像显示，因为路径设置为当前目录。但是使用index.html图像路径将转换为类似http://www.example.com/index.html/imagini/images/background6.jpg的内容。由于浏览器尝试在该路径中找到图像，因此无法找到图像。在Chrome浏览器的开发者工具中检查您的控制台。您可以从那里获得更多细节。

可以通过从图片网址中删除/或使用适当的参数创建.htaccess来解决此问题。

网站在预览中工作正常，但在访问index.html文件时，背景图片丢失

2 个答案: