图像和 css 没有加载到浏览器上，除了在 VS Code 中设置为实时服务器的默认浏览器

Question

我在 vs 代码中使用 HTML 和 CSS 制作了 static 页面。 当我在 VS COde 实时服务器中查看打开 Mozilla firefox 的页面时，一切正常（我已将其设置为实时服务器的默认设置）。 当我在其他浏览器中查看文件 (index.html) 时，图像不会加载。 我检查了元素，上面写着 Failed to load resource: net::ERR_FILE_NOT_FOUND enter image description here

Answer 1

它的问题是路径。 您必须始终使用相对路径。 请使用相对路径，而不是/img/cloud.png使用./img/cloud.png

而且您还使用了airplane.svg的本地文件路径。svg 不起作用。

请向我们提供目录结构，以便我们更好地帮助您。

Answer 2

这与浏览器的选择无关。

您的一条错误消息说它正在尝试从您的 D: 驱动器加载文件。

当 HTML 文档从不同位置加载时，相对 URL 将解析到不同位置。

服务器的 URL ( http file://something http://localhost:somePort/ ) 和 URL 的本地文件 (filesomething ) 将转到不同的本地文件。

您需要始终从服务器提供的 URL 加载 HTML 文档。 您不能只从本地文件系统打开文件。