Markdown 在线预览

左边写 Markdown,右边立刻看到渲染结果。支持表格、代码块、任务清单、引用。写完了可以复制 HTML 或下载 .md 文件。

Markdown 预览工具说明

Markdown 是写文档、写说明、写 README 最省心的格式——纯文本、好编辑、好版本管理,但写的时候看不到效果。这个工具就是补上这一步:左边敲,右边看。

支持的语法

  • 标题:行首一到六个 #,对应 H1 到 H6。注意 # 后面要留一个空格,否则不生效。
  • 强调:*斜体*、**加粗**、***加粗斜体***、~~删除线~~。
  • 列表:- 或 * 开头是无序列表,1. 开头是有序列表,前面加四个空格或一个 Tab 可以嵌套。
  • 任务清单:- [ ] 待办 和 - [x] 已完成,会渲染成复选框。
  • 表格:用竖线分隔单元格,第二行用 --- 标记表头,冒号控制对齐。
  • 代码:行内用反引号包裹;多行用三个反引号围起来,可以在后面写语言名。
  • 引用:行首 >,多条引用可以嵌套使用。
  • 链接与图片:[文字](地址) 和 ![说明](地址)。
  • 分割线:单独一行写三个以上的 -、* 或 _。

表格怎么写

表格是 Markdown 里最容易写错的部分。格式是这样的:

| 姓名 | 部门 | 金额 |
|:-----|:----:|-----:|
| 张三 | 技术 | 1200 |
| 李四 | 市场 | 980  |

三个要点:表头行和分隔行都必须有;分隔行的冒号决定对齐(左边冒号左对齐,两边都有居中,右边冒号右对齐);每行的竖线数量最好一致,虽然不补全也能渲染,但补全了源码更好读。

代码块的语言标记

三个反引号后面写语言名(如 ```javascript),多数编辑器就会做语法高亮。本工具会按语言名给出对应的样式提示,同时保留原始文本,方便你复制到别处。

注意:代码块里的内容不会被当作 Markdown 解析,所以在代码块里写 # 号或星号都是安全的,不会变成标题或斜体。这也是为什么贴报错日志、贴配置一定要放进代码块。

换行这条最容易踩的坑

标准 Markdown 里,单个换行不会产生换行效果——必须留一个空行才算新段落,或者行尾加两个空格表示强制换行。这在写中文时特别别扭,因为大家习惯了随手换行。

所以本工具默认勾选了"单个换行也换行",更符合直觉。如果你要生成严格符合标准的文档(比如要塞进某些静态站点生成器),可以取消勾选。

什么时候该用 Markdown

  • 适合:技术文档、README、会议记录、需求说明、博客草稿、笔记——凡是重内容轻排版,且需要长期维护修改的。
  • 不太适合:需要精细排版、图文混排、多栏布局的正式文档。这类还是用传统文字处理软件更直接。

导出与迁移

工具提供三种出口:

  • 复制 Markdown:拿到纯文本源码,可以贴到任何支持 Markdown 的地方。
  • 复制 HTML:拿到渲染后的 HTML 片段,可以直接嵌到自己网页里。注意这里不含样式表,你需要自己补 CSS 才能好看。
  • 下载 .md:存成一个文件,方便进版本管理或者归档。

所有处理都在浏览器里完成,你写的内容不会离开本机。想验证的话,按 F12 看 Network 面板,敲字时不会有任何请求发出。

常见问题

为什么我写的表格没渲染出来?

最常见的原因是漏了分隔行(第二行的 |:---|:---|)。表头行下面必须紧跟一行由减号和竖线组成的行,表格才会被识别。另外确认每行开头的竖线没被自动缩进。

支持数学公式吗?

不支持。行内 LaTeX 公式需要额外的数学渲染库,本工具坚持零依赖、纯本地,所以没引入。公式请用代码块或图片方式处理。

能直接粘贴图片吗?

不能。Markdown 里的图片是引用地址,不是嵌入数据。你需要先把图片传到某个地方(图床、仓库、自己服务器),再把地址写进 ![说明](地址)。

复制出来的 HTML 为什么没样式?

工具只负责把 Markdown 结构转成 HTML 标签,不带视觉样式——因为不同网站的主题差别很大,硬塞一套样式反而难用。把 HTML 贴进你的页面后,用自己站点的 CSS 控制标题、代码块的外观即可。

内容会丢吗?

刷新页面就会清空,工具不做本地存储。重要内容请及时点"下载 .md"存下来。

相关工具