从根目录打开 index.html 文件时找不到图像和动画答案

【问题标题】：Unable to find images and animations when opened index.html file from root directory从根目录打开 index.html 文件时找不到图像和动画
【发布时间】：2020-05-15 13:16:34
【问题描述】：

我在 Visual Studio Code(IDE) 中设计了一个网页。当我从 VS 代码（IDE）打开文件（index.html）时，每个图像都正常可见，但是当我从根目录打开同一个文件（index.html）时，我无法看到我的和图像。为什么会这样。我检查了每个链接，它是正确的。

<div class="card">
    <div class="card-icon">
       <img src="/Travelly/images/flight.jpg" alt="" />
    </div>
    <h4>Fly</h4>
    <p>Flight included in every purchase.</p>
</div>

这是我在 location-Travelly/images 中有我的图像文件的代码的一部分。

【问题讨论】：

请提供您的代码minimal example，以显示哪些代码不起作用。 How to ask.
您好，这可能是因为您使用了相对路径作为图像src，有时会损坏。打开页面，看看页面的来源图片的路径是什么。

标签： html css

【解决方案1】：

问题是您使用的是绝对路径：/Travelly/images/flight.jpg

如果您直接从您的计算机打开 .html 文件，则该绝对路径会查看您计算机的根目录（路径中的第一个 /），而不是您网站的根目录。

你有两个选择：

通过在前面省略/ 使HTML 中的路径相对；这可能需要您使用..
Run a local server

【讨论】：

非常感谢。真的很有帮助
@NaeemShaik 如果其中一个答案解决了您的问题，请将其标记为正确答案。

【解决方案2】：

1.在浏览器中打开.html页面。
2.打开开发工具（通常按F12）。
3.查看是否显示'404 resource not find'错误。

如果有，请确保修复文件的正确路径。
研究绝对路径和相对路径之间的差异。

【讨论】：