1. 概述
在进行 GitHub 项目开发时，一个结构清晰、内容完整的 README.md 文件是必不可少的。它是用户首次访问项目仓库时最先看到的内容，通常用于说明项目背景、安装步骤、使用方式等关键信息。
虽然 README.md 以文字为主，但适当添加图片可以让内容更直观、更具吸引力。不过，对于刚接触 Markdown 或 GitHub 的开发者来说，如何正确地在 README.md 中插入图片有时会成为一个“踩坑点”。
本文将详细介绍几种在 GitHub 的 README.md 文件中插入图片的方法，包括本地上传、使用相对路径、引用外部图片链接，以及通过 Google Drive 等云服务嵌入图片的方式。
2. 在 GitHub 的 README.md 中添加图片的方法
在 GitHub 上的 README.md 文件中添加图片，主要有以下几种方式：
- 拖拽上传图片至编辑器
- 使用相对路径引用仓库内的图片
- 引用外部托管图片的链接
- 使用 Google Drive 等云服务托管图片并嵌入
下面我们逐一介绍这些方法的具体操作步骤。
2.1. 直接拖拽图片到 README.md 编辑器
这是最简单快捷的方式，适合只想快速插入一两张图片的场景。
操作步骤如下：
- 打开项目仓库，点击 README.md 文件右侧的 Edit 按钮
- 将本地图片直接从电脑拖入编辑器中
- GitHub 会自动将图片上传到仓库的
assets目录，并在编辑器中插入 Markdown 图片语法，例如：
- 可以点击 Preview 查看效果，确认无误后点击 Commit Changes 提交
✅ 优点：简单快捷，适合少量图片
❌ 缺点：不适合大量图片或频繁更新的项目
2.2. 使用相对路径添加图片
如果你希望将图片统一管理在项目仓库中，可以将图片上传到仓库的某个目录（如 images/ 或 assets/），然后通过相对路径引用。
Markdown 语法如下：
⚠️ 注意：
- 必须在图片链接后加上
?raw=true，否则 GitHub 会返回 HTML 页面而非图片 - 图片文件名不要包含空格，推荐使用英文命名，如
logo.png而不是我的图片.png
示例：
✅ 优点：图片与代码一起版本控制，便于维护
❌ 缺点：每次修改需提交 Git 提交，不如外部托管灵活
2.3. 引用外部托管图片链接
如果你不想将图片存储在 GitHub 仓库中，也可以使用外部图片链接，比如来自 CDN、Imgur、Flickr 等平台的图片地址。
Markdown 语法如下：
示例：
⚠️ 注意：
- 确保图片链接长期有效，否则可能出现图片失效
- 使用前确认你有权使用该图片，避免版权问题
✅ 优点：灵活、快速，适合第三方图片资源
❌ 缺点：依赖外部服务，存在失效风险
2.4. 通过 Google Drive 添加图片
如果你使用 Google Drive 存储图片，也可以将其嵌入到 GitHub 的 README.md 中。
操作步骤如下：
- 将图片上传至 Google Drive
- 右键点击图片文件，选择“获取链接”
- 设置权限为“任何有链接者可查看”
- 复制分享链接，例如：
https://drive.google.com/file/d/1aBcD123456789/view?usp=sharing
- 从中提取出图片的 File ID（即
1aBcD123456789） - 构建 Markdown 图片链接如下：
✅ 优点：无需第三方图床，适合已有 Google Drive 资源
❌ 缺点：加载速度可能较慢，且依赖 Google 服务
3. 总结
在 GitHub 的 README.md 文件中插入图片是提升项目可读性和专业度的重要手段。本文介绍了四种常用方法：
| 方法 | 是否推荐 | 适用场景 |
|---|---|---|
| 拖拽上传 | ✅ 推荐 | 快速插入少量图片 |
| 相对路径 | ✅ 推荐 | 图片与项目代码一起管理 |
| 外部链接 | ✅ 推荐 | 使用第三方图床或 CDN |
| Google Drive | ⚠️ 可选 | 有 Google Drive 图片资源时使用 |
根据项目需求和图片来源选择合适的方式，能让你的 README.md 更加专业、美观。
⚠️ 最后提醒： 不管使用哪种方式，请务必检查图片链接是否有效，避免出现“404 图片丢失”的尴尬情况。