关于Github page的引用路径问题
路径问题
1.使用相对路径 （不行）
- 在需要插入图片的位置使用 Markdown 语法:
。 - 相对路径是相对于 Markdown 文件的当前位置来指定图片位置。例如，如果的博客文件位于_posts 文件夹下，图片位于 images 文件夹下，那么相对路径应为:
。 如果图片位于上级目录中，使用 .. 来回退到上级目录。例如，../images/photo.jpg。
2.使用绝对路径
- 在需要插入图片的位置使用 Markdown 语法:
。 - 绝对路径是指图片的完整 URL 路径。可以将图片上传到图床（如 imgur、sm.ms 等）并获取其外链 URL，然后使用该 URL 作为绝对路径插入图片。
绝对路径可以直接引用图片的链接地址。例如，可以使用以下代码引用图片:
。3.用 GitHub 的相对路径 （不行）
- 在需要插入图片的位置使用 Markdown 语法:
。 GitHub 会自动将该地址与仓库的根目录拼接，从而获取到正确的图片 URL。例如:
。4.使用 GitHub 仓库中的 Issue 引用图片
- 将图片上传到 GitHub 仓库的 Issue 中，然后在博客文章中使用 Issue 引用图片。首先，在 GitHub 仓库的 Issue 中创建一个新的 Issue，并将图片作为附件上传。然后，在博客文章中使用以下代码引用该图片:
。
- 使用 GitHub 仓库中的图片链接
- 将图片上传到 GitHub 仓库的某个文件夹中，并获取该图片的链接地址。然后，在博客文章中使用以下代码引用该图片:
。
- 使用第三方图床服务
- 除了在 GitHub 仓库中存储图片，还可以使用第三方的图床服务来存储图片。上传图片到图床服务后，获取图片的链接地址，然后在博客文章中使用该链接地址引用图片。
要在 GitHub Pages 上插入视频链接或直接播放视频，可以使用 Markdown 或 HTML 来实现。在这里有两种方式: 一个是创建一个可点击的视频链接，另一个是直接在页面上嵌入视频播放器。
视频问题
1. 创建可点击的视频链接
如果仅希望提供一个视频下载或打开链接，可以直接在 Markdown 中这样写:
1
[视频下载](https://raw.githubusercontent.com/XiaoWendell/XiaoWendell.github.io/master/files/2023/Wendell_理论微课.mp4 "理论微课")
这种方式会在用户点击链接时打开或下载视频文件。
2. 在页面上嵌入视频播放器
如果希望直接在网页上播放视频，可以使用 HTML5 的 <video> 标签。请注意，直接在 GitHub Pages 上托管较大的视频文件可能会影响加载性能，因此确保文件大小在可管理范围内。
使用 HTML5 视频标签
将视频嵌入到网页中，可以这样写:
1
2
3
4
5
6
<video width="1024" height="576" controls>
<source
src="https://raw.githubusercontent.com/XiaoWendell/XiaoWendell.github.io/master/files/2023/Wendell_理论微课.mp4"
type="video/mp4"
/>
</video>
注意事项
- 文件大小: 确保视频文件不太大，以免影响页面加载速度。GitHub Pages 对于大文件的加载可能会有性能限制。
- 浏览器支持: 大多数现代浏览器都支持 HTML5 视频标签，但某些功能可能在老旧浏览器中不可用。
- 文件路径: 确保视频文件的路径正确，并且该文件是公开可访问的。
通过这些方法，可以在 GitHub Pages 上实现视频的展示和播放。如果有更多的自定义需求，比如使用第三方视频库（如 Video.js），也可以按照类似的方式进行扩展。
本文由作者按照 CC BY 4.0 进行授权