图片未显示在 GitHub 个页面上

Images not showing up on GitHub pages

我已尽一切努力使图像显示在我的 GitHub 页面网站上,但没有任何效果,现在我受够了,如果有人能帮助我解决这个简单的问题,我将不胜感激但烦人的问题。

代码:

...
</footer>
<div><img src="assets/coffee.JPG" alt="coffee"></div>               
</body>

图片目录结构: pagename.github.io/_layouts/assets/coffee.jpg

html 的目录结构: pagename.github.io/_layouts/default.html

它只是显示为带有 alt 标签的损坏图像的标准图标。

有几处可能是错误的。

  1. 可能将文件扩展名改为 .jpg 而不是 .JPG 可以解决问题。

  2. 可能出现了,但是真的很小。尝试为其添加固定的宽度和高度,看看是否有帮助。

图像不显示可能有多种原因

  1. 正在生成的图片 SRC 可能有误,请将 URL 粘贴到新标签中并检查图片是否打开。
  2. 图片的文件扩展名可能是拼写错误,因为我看到你的代码中有 written.JPG 但你的图片是 .jpg 格式

我个人尝试测试在 SRC 中形成的 URL。

由于 Github Pages 使用 jekyll 来生成您的站点,任何带下划线的文件夹,如 _layout 都不会在生成过程中被复制.因此,您的 none 资产将可用。 See documentation.

将您的 _layouts/assets 文件夹复制到您的根目录(pagename.github .io/_layouts/assets/ --> pagename.github.io/assets/) 并确认您使用正确的大小写调用资产。

我刚遇到同样的问题,github 处理您的 github 页面的方式真的很烦人。是的,它是区分大小写的,你应该注意这一点。

我刚刚找到了该问题的解决方案,我会与您分享。 您只需提供任何图像的路径,例如 - images/form.JPG .

不要给出绝对路径,只在您的项目中保留一个文件夹,您将用于图像源。不要使图像路径太长。请注意,这里我没有在图像的开头使用任何反斜杠。

此外,大写的 .JPG 是强制性的,因为我已经尝试了所有可能的解决方案,这对我有用。 不要给你的图片路径 - /images/form.jpg .

如果您的文件名是大写和小写字母的混合,请只使用 'lowercase',这样您就不会遇到任何文件名问题。因为 github 页是 case-sensitive.