html相对路径不起作用,即使vs代码使用相对路径显示图像



我正在用我的电脑练习html,我使用"Live服务器";vscode中的附加组件。图像没有显示相对路径:

<img src="../html/images/coffee background.jpeg" alt="tx"/>

我的根文件夹是css文件夹,我在vs代码中打开了它。CCD_ 2存储在该CCD_ 3文件夹中。

图像被存储在css上方的文件夹中存储的html文件夹内的images文件夹中。

在浏览器的img链接上使用inspect元素会显示:无法获取/html/images/coffee%20background.jpeg

我非常确信这个相对路径是正确的,因为当我点击";跟随链接";在vs代码中,当我将鼠标悬停在链接上时,图像显示在vs代码上。为什么当我运行html文件时,图像不显示?

在Web服务器中,您不能低于Web根目录,而在VSCode中,您可以(我想您可以深入到磁盘根目录)。

所以当你说

我的根文件夹是css文件夹,我在vs代码中打开了它。index.html存储在这个css文件夹中。

这意味着您不能输入";兄弟姐妹;css的文件夹。正如,当运行并且您的根目录是/var/www/customer1_pages时,您显然无法访问"/customer2_pages/passwords.txt";。

../html/images(还有../../../html/images等)与/html/images是一样的,(对于web服务器)意味着<ROOT>/html/images,在您的文件系统中它将是css/html/images

您需要将根文件夹设置为html,并将索引放置在那里。或者在css中移动图像。

最新更新