Question

我对路径有一个奇怪的问题，这个有效（在Windows上）：

<div style="background:url('folder1/image.gif')...

但是这个不起作用（没有图像显示）：

<div style="background:url('/folder1/image.gif')...

这页仍然恰恰相反（不是第一个版本，但第二个版本应该有效）：Background not working for a div

有谁知道原因可能是什么？

Answer 1

第一个网址是相对于服务器中的文件夹，用于呈现网页的HTML。

示例，如果你得到：

www.mywebsite.com/index.html

它将调查：（示例2）

www.mywebsite.com/folder1/image.gif

但如果你在另一个文件夹中，如：

www.mywebsite.com/subfolder/index.html

它会查看：

www.mywebsite.com/subfolder/folder1/image.gif

如果你在beggin中使用'/'，那么路径不是更相对的，它总是在根网站中查找，就像例子2一样，无论你的html位于何处。

Answer 2

第一个是相对路径，第二个是绝对路径

相对路径显示来自调用上下文的文件路径。因此，如果您的html文件是/source/website/test.html，相对路径css/test.css将指向/source/website/css/test.css

中的文件

绝对路径显示与整个路径相关，因此/css/test.css会尝试在/css/test.css

位置查找文件

Answer 3

取决于您的图片和HTML文件的位置。

'folder1/image.gif'将搜索与您的html文件（相对路径）位于同一路径中的folder1。

'/folder1/image.gif'将从服务器的基本位置（绝对路径）开始搜索folder1。

Answer 4

大多数现代浏览器都允许您检查网页上的元素。在chrome（或其他现代浏览器）上打开控制台并查找错误，如果图像URL错误，控制台会将其指示为错误，而且如果您指定了错误的URL，您将获得损坏的图像