如何获取从 images 子文件夹到 html 子文件夹的图像

Question

我是 HTML 初学者。我一直在做一些练习和测试，发现了一个我无法在网上找到答案的问题。基本上，在 VScode 中，当图像位于“images”子文件夹中并且 html 不在子文件夹中时，我可以只使用 src="images/image.jpg"。但是当 HTML 位于子文件夹中时，我尝试执行不同类型的来源，例如 src="Website/images/image.jpg" 或 src="./images/image.jpg"。我知道我可以将 html 放在子文件夹之外，但我很好奇导致它的原因是什么。谢谢你。

无法将子文件夹中的图像导出到另一个子文件夹的解决方案或原因。

Answer 1

如果您的 HTML 文件位于 Website 文件夹中的子文件夹（假设是页面）中，则需要相应地调整路径。假设您的目录结构现在是：

project/
├── Website/
│   ├── images/
│   │   └── image.jpg
│   └── pages/
│       └── index.html

您需要上一级（使用 ../）才能到达网站文件夹，然后导航到图像子文件夹：

<img src="../images/image.jpg" alt="Image">

这告诉浏览器从pages文件夹上一级到Website文件夹，然后进入images子文件夹找到image.jpg文件。