Markdown 图片
图片就是前面加了感叹号的链接：。本文介绍图片标题、尺寸、图片说明、引用式图片，以及部分应用增加的写法。
简短回答
Markdown 怎么插入图片？
依次写感叹号、方括号里的替代文字、圆括号里的图片地址：。地址可以是网址，也可以是相对于 Markdown 文件的路径。Markdown 不能设置图片大小，需要用带 width 的 HTML <img> 标签。
Markdown
显示效果
图片的写法和示例
示例使用本站的一张小图，换成你自己的图片地址即可。
带标题的图片
地址后面引号里的文字是图片标题，鼠标悬停时显示。
Markdown
显示效果
用 HTML 设置大小
Markdown 没有设置尺寸的语法。用带 width 的 <img> 标签设置宽度，高度会按比例变化。
Markdown
<img src="/samples/landscape.svg" alt="蓝天下的绿色山丘" width="240">显示效果
引用式图片
和引用式链接一样，图片地址可以用标签写在文档的其他位置。
Markdown
![蓝天下的绿色山丘][hills]
[hills]: /samples/landscape.svg显示效果
带说明文字的图片
Markdown 没有图片说明的语法。允许 HTML 的地方可以用 <figure> 和 <figcaption>。
Markdown
<figure>
<img src="/samples/landscape.svg" alt="蓝天下的绿色山丘" width="300">
<figcaption>春天的山丘。</figcaption>
</figure>显示效果
Obsidian：竖线后写宽度
Obsidian 在替代文字或嵌入文件名后面加 | 和数字来设置宽度。
Markdown
![[hills.png|200]]仅适用于 Obsidian。其他 Markdown 应用的显示效果不同，因此不提供预览。
Pandoc：花括号里写尺寸
Pandoc 读取图片后面花括号里的宽度和高度，单位可以是像素、厘米或百分比。
Markdown
{width=50%}仅适用于 Pandoc。其他 Markdown 应用的显示效果不同，因此不提供预览。
各平台的图片支持
渲染 Markdown 文件的地方都支持 ，设置尺寸的方法和聊天软件各有不同。
| 应用 | 支持情况 | 说明 |
|---|---|---|
| GitHub / GitLab | 支持 | 支持图片和带 width 的 <img>，相对路径指向仓库里的文件。GitHub 还支持用 <picture> 显示深色模式的图片。 |
| Obsidian | 支持 | 支持图片和嵌入，|300 设置宽度。 |
| VS Code / Typora | 支持 | 预览中支持图片和 <img> 设置尺寸。 |
| Discord / Slack | 不支持 | 没有图片语法，直接上传图片或粘贴图片网址。 |
常见问题
Markdown 怎样调整图片大小？
Markdown 没有尺寸语法，要用 HTML：
<img src="image.png" alt="…" width="300">。Obsidian 支持 ，Pandoc 支持 {width=300px}。怎样让图片居中？
用 HTML 包住图片：
<p align="center"><img src="image.png" alt="…" width="300"></p>。GitHub 保留 align 属性，但会去掉 style。为什么图片不显示？
检查路径：相对路径从 Markdown 文件所在的文件夹算起，大多数服务器上的文件名区分大小写，地址里的空格要写成
%20 或用尖括号包住地址。! 必须紧贴在 [ 前面。替代文字有什么用？
方括号里的文字向屏幕阅读器和搜索引擎描述图片，图片加载失败时也会显示出来。写清楚图片里是什么。
怎样插入电脑里的图片？
把图片放在 Markdown 文件旁边，用相对路径：
。在 GitHub 上，也可以把图片拖进 Issue 或评论框直接上传。GitHub 上怎样在深色模式显示另一张图片？
用
<picture> 元素，在里面写 <source media="(prefers-color-scheme: dark)" srcset="dark.png"> 和一个给浅色模式用的 <img>。怎样给图片加说明文字？
Markdown 没有图片说明的语法。可以在图片下面写一行文字，或者在允许 HTML 的地方使用
<figure> 和 <figcaption>。导出 Word 或 PDF 时图片会保留吗？
会。Markdown 转 Word 会把能加载的图片嵌入文档，Markdown 转 PDF 会随页面一起打印。