Markdown 的设计初衷是作为纯文本也清晰易读，但您仍然想知道最终文档的样子：表格是否对齐、列表是否正确嵌套、代码块是否高亮。实时预览会在源码旁边显示渲染后的效果，并随每一次按键即时更新。
本指南比较了几种常见的 Markdown 预览方式，列出在日常使用中真正有用的功能，并介绍一套快速的工作流程：在浏览器中打开本地文件——无需安装任何软件，也无需把文件发送到服务器。
预览 Markdown 的三种方式
1. 代码编辑器内置的预览
VS Code、JetBrains 系列 IDE 以及许多其他编辑器都内置了 Markdown 预览。如果您本来就整天泡在这些编辑器里，这是个不错的选择。缺点是：必须安装编辑器，数学公式和图表往往需要额外的扩展，而且当同事只是想读一下 README.md 时，您很难把它快速分享给对方。
2. 在线 Markdown 预览工具
左边编辑、右边预览的网站是最快捷的方式：打开一个标签页就能开始输入。问题在于，各种在线工具差别很大。有的会把您的文本发送到服务器上渲染，有的会在不告知您的情况下把文档存储在浏览器中，还有很多只支持基础语法——没有表格、没有任务列表、没有数学公式。
3. 自行部署的预览工具
自行托管的静态 Web 应用兼具网站的便利和完全的掌控权：它运行在您自己的域名上，对整个团队来说都是一样的，能做什么、不能做什么都由您决定。我们在如何自行部署 Markdown 编辑器一文中详细介绍了这种方式。
挑选 Markdown 预览工具时应关注什么
并不是每款预览工具都一样好用。当您每天都要使用时，以下功能最为重要：
- 即时渲染。 预览应在您输入时同步更新，不需要点“渲染”按钮，也不应有明显延迟。
- 同步滚动。 在长文档中，预览必须跟随编辑器滚动，让您正在编辑的段落始终显示在右侧。
- GitHub-Flavored Markdown。 表格、任务列表、删除线、脚注和提示框的渲染效果应与 GitHub 保持一致。如果不太清楚这些是什么，请参阅 Markdown 语法速查表。
- 代码高亮，支持您使用的编程语言。
- 数学公式和图表，如果您撰写技术文档：LaTeX 公式和 Mermaid 图表。
- 打开本地文件。 拖放应支持单个文件、多个文件和整个文件夹——包括文档所引用的图片。
- 导出。 文档完成后，通常需要把它导出为 HTML、PDF 或干净的
.md文件。 - 本地处理。 理想情况下，文本在浏览器中渲染，永远不会离开您的电脑。这对内部文档、合同、草稿和笔记来说尤为重要。
使用 Markdown Preview Editor 的快速工作流程
Markdown Preview Editor 是一款免费开源的编辑器，正是围绕上面这份清单打造的。下面是一次典型的使用过程。
第 1 步：打开编辑器
打开在线版或您自己部署的副本。无需注册，也无需安装。界面提供 15 种语言，并会自动跟随浏览器的语言设置。
第 2 步：打开文件
把一个 .md 文件拖到编辑器上——也可以一次拖入多个文件，或整个文件夹。每个文档都会在独立的标签页中打开，并拥有各自的撤销历史。与文档一起拖入的图片、音频和视频会显示在预览中，因为相对路径是根据您拖入的文件夹来解析的。
更喜欢用键盘？按 Ctrl+O（Mac 上为 ⌘O）选择文件，或使用文件夹按钮打开一个目录。
第 3 步：边写边看预览
在左侧编辑器中输入，右侧的预览会立即更新，并跟随您一起滚动。格式工具栏可以插入标题、列表、链接、表格和代码块。不太常用的工具——脚注、提示框、数学公式、图表——都收在可折叠的高级编辑器一栏中，让工具栏保持整洁。
一键即可在三种视图模式之间切换：仅编辑器、分屏和仅预览。在手机上，布局会自动适配，工具栏也会收起，直到您需要时再展开。
第 4 步：保存或导出
完成后，可以将文档保存为 .md，导出为独立的 HTML 文件，或打印为 PDF。将 Markdown 转换为 HTML 和 PDF一文详细介绍了这些选项。
您的文件去了哪里？
使用许多网页工具时，您很难判断自己的文本是否被上传了。有一个实用的测试方法：打开浏览器的开发者工具，切换到网络（Network）选项卡，然后输入一些内容。如果输入时出现了新的请求，说明您的文本可能正在离开这个页面。
Markdown Preview Editor 在浏览器中完成所有渲染。您打开的文件只在本地读取，文档也只保存在当前打开的标签页中——除非您在设置中开启在此浏览器中记住文档。文档中的外部图片和链接在您允许之前不会加载，因此仅仅打开一个文件，也不会连接其他服务器。
让预览更顺畅的技巧
- 把图片放在文档旁边，存放在
images/或assets/文件夹中，并用相对路径链接。然后拖入整个文件夹，所有内容都会正常显示。 - 每个文件只用一个
#标题。 它会成为导出 HTML 的标题，也让长文档更易于浏览。 - 协作编写文档时，在设置中开启行号——这样像“第 42 行”这样的评审意见就很容易对上号。
- 夜间使用深色模式。 预览会与编辑器一起切换主题。
常见问题
有没有可以离线使用的免费 Markdown 预览工具？
Markdown Preview Editor 完全在浏览器中处理文档，您可以把自己的副本部署在任何 Web 服务器上，或者用 Docker 在本地运行。页面加载完成后，渲染不再依赖任何服务器。
可以预览带图片的 Markdown 文件吗？
可以。把 Markdown 文件和图片一起——或者直接把整个文件夹——拖到编辑器上。images/diagram.png 这样的相对图片路径会根据拖入的文件进行解析。
预览效果和 GitHub 上一样吗？
预览采用 GitHub 风格的样式，并支持 GitHub-Flavored Markdown，包括表格、任务列表、脚注和提示框，因此文档的显示效果与 GitHub 的渲染结果非常接近。
可以同时打开多个 Markdown 文件吗？
可以。每个文件都会在独立的标签页中打开，在一个已打开的 .md 文件中点击指向另一个文件的链接，就会切换到对应的标签页。