上传 GitHub 页后，图片不会加载到网站上

Question

我需要我的图片通过我的页面 URL 显示在我的网站上。您可以在 index.html 中的第 20 和 83 行以及 style.css 中的第 10 和 315 行中找到我正在谈论的具体代码。谢谢！

这是我的存储库：https://github.com/rushishelat/Website1

Answer 1

如果您将 URL 发布到实时站点，以便人们查看您的项目实际发生的情况，这将很有帮助 - 例如，您的站点位于：

https://rushishelat.github.io/Website/

鉴于作为基础 URL，您还可以确认所有图像源 link 应该相对于 index.html 文件，或者绝对相对于托管 URL，例如：

https://rushishelat.github.io/Website/Picture1-removebg-preview.png

在查看您的 index.html 文件时，我看到了这样的 img src 引用：

<img src="/Users/rushishelat/Website/Website/1615826424211.png"

实时站点上不存在此路径。

如果您将其替换为相对 URL，无论项目在何处提供，只要图像文件相对于索引文件的位置不变，它都可以正常工作，例如- 这个：

<img src="./1615826424211.png">

这会起作用，因为文件路径是相对于索引的 - ./ 语法意味着在当前目录中，所以在这种情况下服务位于相同 URL 作为 index.html 文件。

编辑：关于下载 link - 将下载添加到 href 如下：

<button id="project-button" type="submit" class="trading-bot"></i>
       <a id="srs" href="file:///Users/rushishelat/Website/website.html#" download>Check It Out!</a>
</button>

上传 GitHub 页后，图片不会加载到网站上

Images won't load on website after uploading with GitHub pages

html

css

github-pages