Markdown 预览与转换 - 在线渲染、转 HTML、HTML 转 MD
左边写 Markdown 右边实时渲染,支持表格、代码块与原始 HTML 且渲染前消毒,还能一键转成完整 HTML 或把 HTML 转回 Markdown
The tool itself switches to English, but this long-form guide is currently written in Chinese only.
Markdown 预览与转换 - 在线渲染、转 HTML、HTML 转 MD是什么
Markdown 写起来舒服,但发到不同平台常出问题:有的不支持表格、有的把单个换行当空格。这个工具左边写右边实时渲染,能先看清效果再发出去;也能一键转成自带样式的完整 HTML 文件,或者反过来把一段 HTML 转回 Markdown——从网页复制内容时特别有用。
所有计算都在你的浏览器本地完成,输入的内容不会上传到服务器。
怎么用Markdown 预览与转换 - 在线渲染、转 HTML、HTML 转 MD
- 实时预览:左边写 Markdown,右边立刻渲染。顶部的「识别到语法」会列出这段用到了哪些格式,用来确认表格、代码块有没有被正确识别
- 渲染前会过一遍安全过滤,脚本与内联事件会被移除。如果提示「部分内容被安全过滤移除」,说明你写的某个标签被拦了
- 要发给别人时点「下载 HTML」,得到一个自带排版样式的独立文件,双击就能在浏览器打开,不依赖任何外部资源
- HTML 转 MD:切到第三个页签,粘贴一段 HTML,右边会输出等价的 Markdown,标题用井号风格而不是下划线
示例
输入
# 标题(井号加空格)紧接着空行再接 - 列表项,然后空行接三行表格输出
<h1>标题</h1><ul><li>列表项</li></ul><table>...预览页可直接看到渲染效果
常见问题
为什么我写的 HTML 标签直接显示成文字了?
可能是你关掉了「允许原始 HTML」。这个开关默认打开,关掉后所有标签都会被转义成文字显示。关掉更安全,但 details、summary 这类折叠块就用不了。
预览里的样式和我发布后的效果不一样?
预览用的是本站的一套基础排版样式,只保证结构正确、可读。发布到公众号、博客或自己的站点后,样式由目标平台的 CSS 决定,字体、行距、表格边框都会变。
HTML 转 Markdown 会丢东西吗?
会。Markdown 能表达的格式比 HTML 少得多,内联样式、复杂的嵌套表格、自定义属性都会丢失或简化。转换后建议对一遍关键位置,尤其是表格与代码块。
小提示
- 「单个换行即换行」这个开关在不同平台默认值不一样:微信、聊天软件通常是换行即换行,而标准 Markdown 会把单个换行当空格。发之前先对一下目标平台的习惯
- 表格必须三行起步:表头、分隔行(由减号组成)、数据行。少了分隔行就不会渲染成表格,这是最常见的手误
- 代码块用三个反引号包起来,后面可以跟语言名做高亮。缩进四个空格也能表示代码块,但和列表嵌套混在一起时容易失效,推荐用反引号
- 转出来的 HTML 是片段加一份内置样式,不是完整的网站模板。要做成正式页面,把 body 里的内容搬到你自己的布局里即可