Markdown 预览
编写 Markdown 并在旁边实时预览 HTML:支持 GitHub 风格的表格、任务列表和删除线。可复制净化后的 HTML 或下载 .html 文件。
输入内容和文件始终留在浏览器中
在此编写或粘贴 Markdown,或加载示例。
输入时,渲染后的预览将显示在这里。
本页内容
在一侧输入 Markdown,另一侧实时显示渲染结果——适合起草 README、issue 评论、文档和发布说明,然后导出为 HTML。
详细功能
渲染使用 marked 库并启用 GitHub Flavored Markdown:表格、任务列表 - [x]、删除线 ~~text~~、围栏代码块以及裸 URL 自动链接。与 GitHub 评论一样,单个换行会变成 <br>,因此多行不会被合并成一段。代码块以等宽字体显示,不进行语法着色。
Markdown 中的原始 HTML 会被净化:脚本、iframe、表单、样式以及 onclick 这类事件属性会被移除,javascript: 链接会被拦截,而 <kbd>、<details>、<sub> 等无害标签会保留。链接在新标签页中打开。预览中的标题会降低一级显示,以免与页面标题冲突;复制 HTML 和 下载 HTML 保留原始的 <h1>–<h6>。
工具栏可在光标处插入粗体、斜体、标题、链接、图片、行内代码和列表语法,同步滚动 让两个窗格保持在相同的相对位置。一切都在浏览器中运行,工具不会保存您的文本——关闭页面前请先复制。
实用示例
任务列表:- [x] tests 和 - [ ] docs 渲染为一个已勾选和一个未勾选的复选框。
换行:两行 line one 和 line two ~~old~~ 变成 <p>line one<br>line two <del>old</del></p>。
表格:| A | B |、|---|---|、| 1 | 2 | 三行变成带表头行的 HTML 表格。
不安全的 HTML:<script>alert(1)</script><b onclick=x>hi</b> 导出后只剩 <b>hi</b>。
如何使用此工具
编写 Markdown
在 Markdown 编辑器 中输入。首次打开时会显示示例文档;点击 清除 从空白页开始。
用工具栏设置格式
选中文本,使用格式按钮(粗体、斜体、标题、链接、图片、代码、列表)插入相应语法。
检查预览
预览 窗格随每次按键更新;开启 同步滚动 可让两个窗格一起滚动。
导出
使用 复制 HTML 或 复制 Markdown,或点击 下载 HTML 保存带基础样式的
markdown-preview.html。
提示和最佳实践
- 这里无法解析
img/logo.png这样的相对图片路径;请使用完整的https://地址来显示图片。 - 其他网站的图片由浏览器直接从对应服务器加载。
- GitHub 专有的扩展——
@mentions、:smile:这类表情短代码、Mermaid 图表和数学公式——会显示为纯文本。 - 可以使用
<kbd>Ctrl</kbd>或<details>等行内 HTML,但style和class属性会被移除。 - 下载的文件是使用浅色样式的独立页面,可直接打印或作为附件发送。