我正在用我的电脑练习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中移动图像。