Markdown编辑器

实时预览的 Markdown 编辑器,支持导出 HTML,纯前端运行,数据不上传

Markdown编辑器使用说明

本工具采用 marked.js 开源库实现 Markdown 解析,所有编辑和预览均在您的浏览器中完成,无需联网即可使用,数据不会上传到任何服务器。

  • 左侧编辑:在左侧文本框中输入 Markdown 语法,右侧实时显示渲染结果。
  • 导出 HTML:点击"导出 HTML"按钮,将当前 Markdown 渲染为完整 HTML 文件并下载。
  • 示例文本:点击"示例文本"可加载一段包含各种 Markdown 语法的演示文本。

常用 Markdown 语法速查

语法效果
# 标题一级标题
## 标题二级标题
**粗体**粗体
*斜体*斜体
[链接](url)超链接
![图片](url)插入图片
`代码`行内代码
```代码块```代码块
- 列表项无序列表
1. 列表项有序列表
> 引用引用块
| 表头 | 表头 |表格
---分隔线

常见问题

Markdown 和 Word、富文本编辑器是什么关系?

Markdown 是纯文本格式,用 `#`、`**`、`*` 这些简单符号标记标题、粗体等结构,文件本质就是一个 .md 文本文件;Word 和网页富文本保存的则是带格式的二进制或 HTML 文件。二者是“同一种内容、两种载体”:Markdown 负责写,导出的 HTML 负责展示。由于纯文本可读、可逐行 diff,Markdown 被 GitHub、技术文档和博客系统广泛采用,写作时能专注内容本身。

导出的 HTML 和网页预览样式不一样,是正常的吗?

正常。预览的样式来自本页 CSS,而导出文件自带一套独立内联样式(标题字号、正文、表格、代码块都有基本排版),保证双击打开就能阅读,所以两者在字体、间距等细节上会有差别;另外导出的代码块没有语法高亮,只保留深色底白字。若需要和预览完全一致,可以把预览区渲染好的源码复制到自己的模板中再导出;本工具的导出适合生成可分享的网页初稿。

为什么我写的表格没有渲染成表格?

最常见原因是缺少“分隔行”:Markdown 表格要求表头下面必须有一行 `| --- | --- |`,每列至少一个短横线,并且表格前后要与正文之间留空行;只写一行表头不会生效。另一个高频错误是从网页复制的竖线被转成全角符号“|”,导致格式失效。修复方法:补齐分隔行、统一用英文半角竖线、前后留空行,再刷新预览即可。

它和 Typora、Obsidian 等本地编辑器比,有什么不同?

本工具是网页版,无需安装、打开即用,适合临时记录、快速演示和导出 HTML;但它不提供本地文件保存、云同步、主题插件等能力,关闭页面后输入的内容不会自动落盘成 .md 文件。Typora、Obsidian 等客户端则有文件树、多主题、插件和云盘联动。建议把在线工具当“速记与转换器”,正式文档交给本地工具管理并定期备份。

写好的 Markdown 怎么带回项目或发到平台?

把左侧源码全选复制,粘贴到本地保存为 .md 文件,GitHub、GitLab、VSCode、Typora、Obsidian 都能直接打开;需要网页形态时点“导出 HTML”下载完整文件即可。注意知乎、微信公众号、飞书等平台不支持直接粘贴 .md 源码,需要先把 Markdown 渲染成富文本再粘贴,或用平台自带的导入功能,直接贴源码会显示成一堆井号和星号。