Markdown 怎么插入图片？
图片不显示的原因和修法

语法

图片就是前面加了 ! 的链接:

网络图片（URL）：
![一只睡觉的猫](https://example.com/cat.png)

本地图片（相对这个 .md）：
![项目示意图](images/diagram.png)

图片加载不出来时，显示 alt 文字：
![季度营收图](charts/q3.png)

• !——标明这是图片,不是文字链接。
• alt 文字([ ] 里)——描述图片;加载不出来时显示,也给屏幕阅读器和搜索引擎读。务必写。
• 路径(( ) 里)——要么网络 URL(https://…),要么本地文件的路径。

网络图片 vs 本地图片

路径是最容易搞混的地方:

• 网络 URL:![](https://example.com/pic.png)——有网到处能加载,本地不用管。
• 本地路径:![](images/pic.png)——指向磁盘上的文件,相对 .md 文件自身的位置解析。它把图片和笔记放一起,但打开 .md 的工具得能读到那个本地文件。

最后这点,正是"图片不显示"的症结。

Markdown 图片为什么不显示

最常见的一个:相对路径的起点写错了。记住它是相对 .md 文件的——笔记在 notes/report.md、图片在 notes/images/pic.png,那路径就是 images/pic.png,不是 notes/images/pic.png。

把图片和笔记放一起

一个整洁、可移植的做法:图片放在 .md 旁边的 images/ 子文件夹,用相对路径引用。把笔记和文件夹一起移动,路径依然有效。整理一堆笔记和素材,看 md 文件怎么整理。

用 NoteLoom 编辑图片 markdown

NoteLoom 是个在浏览器里读写本地 .md 文件的编辑器。你挂载一个本地文件夹,笔记和图片文件就在同一个地方,这正是相对图片路径为之设计的场景。因为文件夹是挂载的,NoteLoom 能真的把这些本地图片显示出来:它的 reading 和 live 视图会解析 images/pic.png 这样的相对路径、把图内联渲染出来,而一个够不到你本地文件的查看器只会留一片空白。你在 live 或 source 视图里写和改 ![alt](路径) 引用,直接存回本地文件。

先说清边界:NoteLoom 没有任何 AI——不会替你生成图片、抓图片、写 alt 文字。它只负责打开、编辑、存回本地 Markdown;图片引用由你自己写。

用起来:用 Chrome / Edge / Arc 打开 app.noteloom.cc → 挂载放着笔记和图片的文件夹 → 打开 .md → 在 source 视图写或改图片路径 → 存回本地,不上云、不用账号。