Markdown编辑器 在线写作与实时预览
Markdown编辑器，支持实时预览渲染效果、表格任务列表和代码高亮，一键导出HTML或.md文件，适合写作、笔记、博客和文档整理。
更新于 2026-08-16
相关工具
功能特性
- 实时预览：输入 Markdown 的同时右侧面板即时显示渲染后的 HTML 效果
- 分栏编辑：左侧编辑 Markdown 源码，右侧并排查看渲染结果
- 视图模式切换：一键切换纯编辑、纯预览、左右分栏三种视图模式
- 工具栏快捷键：粗体、斜体、标题、链接、图片、列表、代码块一键插入
- 复制 HTML：一键复制渲染后的完整 HTML 代码，用于网站或邮件
- 保存为 .md 或 .html：保存为 Markdown 源文件或导出渲染后的 HTML
- 拖拽 .md 文件：将 Markdown 文件拖入编辑器即可加载内容
- 字数、字符数和行数统计：底栏实时显示文本统计信息
- GitHub 风味 Markdown：支持表格、任务列表、删除线、自动链接和代码块语法高亮
- 响应式设计：桌面端左右分栏，移动端自动上下堆叠
使用方法
- 1在左侧编辑区输入或粘贴 Markdown 文本，右侧面板实时显示渲染效果。
- 2使用顶部的视图切换按钮（编辑/预览/分栏）切换不同编辑模式。
- 3点击工具栏按钮（B、I、H、链接、图片、列表、代码）在光标位置插入 Markdown 语法。
- 4拖拽 .md 文件到编辑器区域即可加载内容，或点击打开按钮选择文件。
- 5点击复制 HTML 将渲染结果复制到剪贴板，或使用保存功能保存为 .md 或 .html 文件。
- 6底栏实时显示字数、字符数和行数统计信息。
- 7使用宽屏/标准切换按钮在全宽编辑和舒适的居中阅读宽度间切换。
- 8点击示例下拉菜单加载预设 Markdown 片段，展示表格、任务列表、代码块等语法。
- 9使用键盘快捷键：Ctrl+B 粗体、Ctrl+I 斜体、Ctrl+K 链接、Ctrl+Shift+C 代码块。
- 10使用纯预览模式获得干净的阅读体验，适合校对和查看格式化内容。
- 11使用撤销/重做按钮或 Ctrl+Z / Ctrl+Shift+Z 从编辑错误中恢复。
常见问题
支持哪些 Markdown 语法？
完整支持 GitHub 风味 Markdown（GFM），包括标题（H1-H6）、粗体、斜体、删除线、链接、图片、有序和无序列表、任务列表、代码块（含语法高亮）、表格、引用、水平线和行内代码。底层使用 marked 解析器。
可以导入已有的 Markdown 文件吗？
可以。直接将 .md 文件拖拽到编辑区即可加载，或点击打开按钮浏览选择文件。文件内容会替换当前编辑区内容。也可以直接粘贴 Markdown 文本。
可以导出渲染后的 HTML 吗？
可以。点击复制 HTML 可将完整渲染结果复制到剪贴板，适合粘贴到网站、邮件或 CMS 编辑器。也可点击下载选择 HTML 格式保存为 .html 文件。两种方式都保留完整的渲染效果。
支持哪些文件保存格式？
两种格式：Markdown（.md）保存原始源码，方便后续继续编辑；HTML（.html）保存完整渲染结果，可直接发布。HTML 文件包含基本的文档结构和渲染内容。
支持表格和任务列表吗？
支持。GitHub 风味 Markdown 的表格和任务列表完全兼容。用竖线和短横线创建表格，用 [x] 和 [ ] 语法创建任务列表，预览面板中会正确显示。
内容大小有限制吗？
没有严格限制，但超大文档（10,000 行以上）可能影响实时预览性能。对于文档、笔记或 README 等常见场景，性能完全即时。编辑大文件时可切换到纯编辑模式减少渲染开销。
能把 Markdown 转成 Word 文档吗？
不能直接转。本编辑器只保存 .md 和 .html，没有 .docx 导出。可行的路径：保存为 HTML 后用 Word 打开（Word 对 HTML 的导入效果尚可），或在命令行用 pandoc（pandoc file.md -o file.docx）做带样式的忠实转换。如果内容以文本和表格为主，Word 导入 HTML 输出通常就够用了。
可以在手机或平板上用这个编辑器吗？
可以，小屏下布局会自动上下堆叠，工具栏支持触摸操作，适合快速编辑、记笔记和写短文。但长文档建议用桌面浏览器：左右分栏预览、键盘快捷键和拖拽打开文件都是围绕真实键盘设计的。
什么是 GitHub 风味 Markdown（GFM）？
GFM 是标准 Markdown 的超集，增加了表格（竖线和短横线）、任务列表（[x] 和 [ ]）、删除线（~~文字~~）、自动链接（URL 自动可点击）、围栏代码块（含语法高亮）和表情符号简码（:smile:）。是 GitHub、GitLab 等平台使用最广泛的 Markdown 变体。
可以用这个工具写文档或 README 吗？
当然可以。编辑器非常适合编写 README 文件、API 文档、内部维基和技术博客。使用分栏视图边写边看渲染效果。导出为 .md 在其他地方继续编辑，或 .html 直接发布。
Markdown 中支持 HTML 吗？
支持。原始 HTML 标签会在渲染输出中保留。可以直接在 Markdown 中嵌入 <div>、<span>、<img> 或 <iframe> 等 HTML 标签。这适用于添加 Markdown 语法无法表达的自定义样式或嵌入媒体。
如何在 Markdown 中创建目录？
Markdown 没有原生目录语法，但可以利用标题锚点手动创建。标题会自动生成锚点链接：'# 介绍' 会变成 '#介绍'。使用标题 ID 创建目录列表：[介绍](#介绍)、[快速开始](#快速开始)。部分平台会自动从标题生成目录。
这个编辑器支持多人协作吗？
这是单用户编辑器，不支持实时协作。如需协作，导出 Markdown 文件后通过版本控制（Git）或协作平台分享。编辑器用于个人写作和排版，而非多用户编辑。
Markdown 中如何添加图片？
使用图片语法：。点击工具栏的图片按钮在光标位置插入语法。预览面板会在链接可访问时渲染图片。本地图片需要先上传到图床服务，因为编辑器完全在浏览器端运行。
为什么预览里我的换行不生效？
这是标准 Markdown 行为：单个换行不会产生换行，文本会合并为同一个段落。要开始新段落，在块之间留一个空行；要在段落内强制换行，在行尾加两个空格或用 <br>。GitHub 上也是同样的规则，所以这不是编辑器的 bug。
为什么我的 markdown 编辑器 在线渲染效果和 VS Code 不一样？
渲染差异来自 Markdown 方言：本编辑器遵循 GitHub Flavored Markdown（GFM）并带自己的扩展，VS Code 使用 CommonMark 配合 markdown-it 配置。表格、任务列表、删除线和内联 HTML 在两者中行为一致，但扩展语法（脚注、折叠块、高亮）可能有差异。无论 markdown 编辑器 在线 还是本地（如 Windows 上的 VS Code），源文本完全相同，只是渲染器不同。
为什么这个 markdown 编辑器不能渲染 LaTeX 数学公式？
本编辑器的语法集不包含数学公式支持：预览用的是轻量 GFM 渲染器，没有内置 MathJax 或 KaTeX 引擎。如果文档需要公式，请导出文件后用支持 LaTeX 的工具（Obsidian、Typora 或 GitHub 的数学扩展）渲染，或在这个 markdown 编辑器里先用纯文本或代码块表示公式。