Markdown编辑器与预览

如何使用Markdown编辑器

1. 在左侧的编辑器中输入或粘贴 Markdown。
2. 边写边看实时预览同步更新，预览使用 GitHub 风格的 Markdown（GFM）渲染。
3. 点击复制 HTML，复制生成的 HTML，用于网站、CMS 或电子邮件。
4. 或者复制 Markdown 本身，用于 README、议题、拉取请求或文档页面。

渲染在浏览器中进行，文本不会被上传或保存。渲染出的 HTML 经过净化，因此粘贴内容中的脚本和危险属性会在显示预览之前被清除。

什么是Markdown？

Markdown 是由 John Gruber 于 2004 年创建的轻量级标记语言。它用纯文本标点来表示格式：# 表示标题，* 或 _ 表示强调，- 表示列表。源文本作为纯文本依然易读，再由渲染器把它转换成 HTML。

最初的说明留下了许多未定义的边界情况，因此各种实现之间并不一致。CommonMark 是一份详细的规范，消除了这些歧义；GitHub 风格的 Markdown 是 CommonMark 的超集，增加了开发者每天都在使用的功能：

Markdown速查表

# Heading 1
## Heading 2

**bold**, *italic*, `inline code`

- Bullet item
  - Nested item (indent two spaces)
1. Numbered item

[Link text](https://example.com)
![Alt text](image.png)

> A blockquote

```python
print("fenced code with a language")
```

常见的Markdown问题及修复方法

标题没有渲染。CommonMark 要求井号后面有一个空格。#Title 是纯文本；# Title 才是标题。

多行被合并成一个段落。段落内部的单个换行会被当作一个空格。请留一个空行来开始新段落，或者在行尾加两个空格或一个反斜杠来强制换行。（GitHub 评论对单个换行的处理与 README 文件不同，这是常见的困惑来源。）

列表或代码块过早中断。属于某个列表项的内容必须缩进，与该列表项的文字对齐。对于列表中的代码，请把整个围栏代码块缩进：

1. Install the package:

   ```bash
   npm install example
   ```

2. Run it.

表格没有渲染。GFM 表格需要一个标题行、一个每列至少有三个短横线的分隔行，而且通常在它前面要有一个空行。在分隔行中使用冒号（:---、:---:、---:）来对齐各列。

意外的格式。*、_ 和 # 这样的字符可能触发格式。请用反斜杠对它们转义，例如 \*not italic\*，或者用反引号把它们括起来。

提示与最佳实践

• 务必在起始反引号后面加上语言名称，这样在支持的地方代码块就能获得语法高亮。
• 为图片撰写有意义的替代文本；屏幕阅读器会使用它，图片加载失败时也会显示它。
• 在长文档中每行写一句话；Markdown 会把它们合并成段落，而且差异对比会干净得多。
• 先把 JSON 或 YAML 示例粘贴到 JSON格式化与校验或 YAML格式化与校验中，这样文档里的代码块才是有效且整洁的。
• 如果要把生成的 HTML 粘贴到网页中，请先用 HTML格式化整齐地缩进它。

常见问题

Markdown 和 GitHub 风格的 Markdown 有什么区别？

GFM 是 GitHub 定义的 CommonMark Markdown 的超集。它增加了表格、任务列表、删除线、扩展的自动链接，以及对原始 HTML 的一些限制。大多数为 GitHub 编写的 README 在这里的渲染效果相同。

可以在 Markdown 中使用 HTML 吗？

可以，Markdown 允许内联 HTML。为了安全，预览会对输出进行净化，因此像 <script> 这样的标签、像 onclick 这样的事件处理属性以及 javascript: 链接都会被移除。

为什么我的 Markdown 在另一个网站上看起来不一样？

各个平台使用不同的 Markdown 风格和各自的样式表。核心语法（标题、强调、列表、链接、代码）是一致的，但表格、换行以及脚注或数学公式等扩展在不同的渲染器之间会有所不同。

如何把 Markdown 转换成 HTML？

编写或粘贴 Markdown，查看预览，然后点击复制 HTML。输出的是不带样式的纯语义化 HTML（标题、段落、列表、表格），因此会沿用您粘贴到的页面的 CSS。

更新于 2026-10-17