为什么在 HTML 文件中找不到 .png 文件路径？

Why is the .png file pathway not found in the HTML file?

提问人：H3llo-World-Dev 提问时间：9/1/2023 最后编辑：SurH3llo-World-Dev 更新时间：9/1/2023 访问量：31

问：

我正在尝试在 QR 卡项目的 HTML 文件中以 .png 文件的形式链接图像。该文件是本地的，我已经尝试了该路径的多次迭代，但没有运气。无论我似乎将文件保存在哪里，图像都不会出现在网页上！这是 .png 和文件位置信息。

screenshot of the html script

以下是文本格式的元素，供进一步考虑 这样做的结果是浏览器显示“alt”描述？ 我真的不知道为什么这不起作用，任何帮助将不胜感激！

<img src="MyFiles/QR_CARD/qr-code-component-main/images/image-qr-code.png" alt="DogWater">
HTML 图像 文件

评论

0赞 Josef Abo Shady 9/1/2023
只需将图像移动到您的工作目录
0赞 H3llo-World-Dev 9/1/2023
我是相当新的，所以也许我错过了一些超级明显的东西，但我无法将 .png 文件从我的文件移动到 VScode 中？我尝试创建一个单独的图像文件夹。也许你可以详细说明你的答案？
0赞 Rob 9/1/2023
请勿发布代码、数据、错误消息等图像。- 将文本复制或输入到问题中。如何询问
1赞 Rob 9/1/2023
这个问题似乎每小时都会在这里和互联网上被问到，解决方案总是一样的：你的路径名是错误的。stackoverflow.com/questions/76407567/......

答：

1赞 ray 9/1/2023 #1

图像的路径是相对于 html 文件解析的。

如果您的 html 文件是

MyFiles/QR_CARD/qr-code-component-main/index.html

你的形象是

MyFiles/QR_CARD/qr-code-component-main/images/image-qr-code.png

那么 IMG SRC 将是

./images/image-qr-code.png.

（这并不是每个场景都 100% 正确，但就本次对话而言，我认为这是真的。

评论

0赞 H3llo-World-Dev 9/1/2023
因此，在尝试了许多其他事情之后，我意识到我的问题是我似乎根本无法在 VS Code 中将任何图像文件添加到文件夹中？我创建了一个新文件夹，并尝试将图像文件拖放到其中但没有成功？我错过了什么？我知道这可能太愚蠢了
0赞 ray 9/1/2023
你从哪里拖来？它们是否位于您期望它们在文件系统上的位置（在 vs code 之外）？vs code 中有一些设置会从资源管理器中隐藏某些文件，因此它们可能在那里，只是隐藏在视图中。这似乎不太可能，但值得检查。

上一个：当我更改文件夹名称时，一些HTML函数开始工作

下一个：实现从电子.js到外部应用程序的拖放