为 Markdown 插入图片

为 Markdown 插入图片

原文日期: 2016-10-28
来源: https://github.com/wlz0726/wlz0726.github.io


Markdown 图片语法

1
![替代文字](图片 URL "可选标题")

图床推荐

1. 七牛云 ⭐ 推荐

  • 免费额度:10GB 存储 + 10GB 流量/月

  • 配置简单

  • 国内访问快

配置步骤

  1. 注册七牛云

  2. 创建对象存储 bucket

  3. 配置 PicGo 等工具

  4. 绑定自定义域名(可选)

2. SM.MS

  • 免费:5GB 存储空间

  • 无需注册即可上传

  • API 友好

1
![图片](https://i.loli.net/2021/01/01/xxxxx.png)

3. GitHub + jsDelivr

  • 完全免费

  • 需要配置

  • 访问速度取决于网络

1
![图片](https://cdn.jsdelivr.net/gh/username/repo@master/path/image.png)

4. Imgur

  • 国际通用

  • 免费 unlimited

  • 需要科学上网

最佳实践

  1. 使用相对路径(本地文档)
1
![图片](./images/screenshot.png)
  1. 使用 CDN 加速(网络文档)
1
![图片](https://cdn.example.com/image.png)
  1. 添加 alt 文字(无障碍)
1
![系统架构图](./images/architecture.png)
  1. 压缩图片(提升加载速度)

常用工具

  • PicGo: 图片上传工具

  • iPic: Mac 图片上传工具

  • Typora: 支持直接粘贴图片


此文档为 GitHub 博客自动归档