Markdown转HTML
Markdown转HTML转换器,支持实时预览和多格式导出
Markdown编辑器
HTML预览
HTML预览将显示在这里...
支持的Markdown语法
✓标题、段落、列表
✓粗体、斜体、删除线
✓链接和图片
✓代码块和语法高亮
✓表格和引用
✓数学公式(LaTeX)
✓Emoji表情
✓任务列表
✓脚注
✓目录生成
快速操作
快捷键
Ctrl+B - 粗体
Ctrl+I - 斜体
Ctrl+K - 链接
Ctrl+S - 保存
Ctrl+P - 预览
F11 - 全屏
当前主题
github
主题会影响导出的HTML样式
输出设置
Markdown 完全指南
掌握 Markdown 语法,提升写作和文档制作效率
基础语法
标题 (Headers)
# H1 标题
## H2 标题
### H3 标题
## H2 标题
### H3 标题
# 的数量表示标题级别
文本样式
**粗体文本**
*斜体文本*
~~删除线文本~~
`行内代码`
*斜体文本*
~~删除线文本~~
`行内代码`
使用符号包围文本来添加样式
列表 (Lists)
- 无序列表项 1
- 无序列表项 2
1. 有序列表项 1
2. 有序列表项 2
- 无序列表项 2
1. 有序列表项 1
2. 有序列表项 2
- 或 * 创建无序列表,数字创建有序列表
高级语法
代码块
```javascript
function hello() {
console.log('Hello!');
}
```
function hello() {
console.log('Hello!');
}
```
用三个反引号包围代码,可指定语言
表格 (Tables)
| 标题1 | 标题2 |
|-------|-------|
| 内容1 | 内容2 |
|-------|-------|
| 内容1 | 内容2 |
使用 | 分隔列,- 分隔标题行
链接和图片
[链接文本](https://example.com)


! 前缀表示图片,否则为链接
最佳实践
📝
保持一致的格式
统一使用相同的符号和缩进风格
📚
合理使用标题层级
从 H1 开始,按顺序递进使用标题
🔗
添加有意义的链接文本
避免使用"点击这里",使用描述性文本
📖
使用空行分隔内容块
在段落、列表、代码块间添加空行
🎯
为代码块指定语言
启用语法高亮,提高可读性
🌟
适当使用引用和强调
突出重要信息,但不要过度使用
编辑器与工具
在线编辑器
Typora所见即所得编辑器
StackEdit在线 Markdown 编辑器
Dillinger云端 Markdown 编辑器
代码编辑器插件
VS CodeMarkdown 预览插件
Sublime TextMarkdownPreview 包
Atommarkdown-preview-plus
移动端应用
BeariOS/Mac 笔记应用
iA Writer跨平台写作工具
Notion支持 Markdown 的笔记
常见应用场景
📖 技术文档
- • API 文档编写
- • README 文件
- • 项目说明文档
- • 安装指南
✍️ 内容创作
- • 博客文章写作
- • 学术论文格式
- • 电子书编写
- • 新闻稿制作
📊 项目管理
- • 会议记录
- • 项目计划书
- • Wiki 页面
- • 任务清单
语法速查表
基本格式
粗体:
**text** or __text__
斜体:
*text* or _text_
代码:
`code`
删除线:
~~text~~
结构元素
链接:
[text](URL)
图片:

引用:
> quote text
分隔线:
---
常见问题解决
❌ 列表不显示
✅ 在列表项前确保有空行,使用正确的缩进
❌ 代码块无语法高亮
✅ 在 ``` 后添加语言标识符
❌ 链接显示为文本
✅ 检查括号和方括号的正确配对
❌ 表格格式混乱
✅ 确保每行有相同数量的 | 分隔符
❌ 特殊字符显示异常
✅ 使用反斜杠 \ 转义特殊字符
❌ 标题编号不连续
✅ 按 H1→H2→H3 顺序使用标题层级