Markdown转HTML工具
功能强大的在线工具,支持实时预览、多种主题、AI助手等专业功能
实时预览
10+主题
自定义主题
跟随系统
微信公众号
搜索替换
上传
示例
清空
搜索
AI助手
设置
Markdown编辑器
# Markdown完整语法示例 这是一个**全面的Markdown语法演示文档**,涵盖了所有常用的Markdown元素。 ## 目录 - [文本样式](#文本样式) - [标题层级](#标题层级) - [列表](#列表) - [链接和图片](#链接和图片) - [代码](#代码) - [引用](#引用) - [表格](#表格) - [其他元素](#其他元素) --- ## 文本样式 **粗体文本** 或 __另一种粗体__ *斜体文本* 或 _另一种斜体_ ***粗斜体*** 或 ___粗斜体___ ~~删除线文本~~ 普通文本中的 `行内代码` 效果 --- ## 标题层级 # 一级标题 H1 ## 二级标题 H2 ### 三级标题 H3 #### 四级标题 H4 ##### 五级标题 H5 ###### 六级标题 H6 --- ## 列表 ### 无序列表 - 第一项 - 第二项 - 嵌套项 2.1 - 嵌套项 2.2 - 深层嵌套 2.2.1 - 第三项 ### 有序列表 1. 第一步 2. 第二步 3. 第三步 1. 子步骤 3.1 2. 子步骤 3.2 4. 第四步 ### 任务列表 - [x] 已完成的任务 - [x] 另一个已完成任务 - [ ] 待办任务 - [ ] 另一个待办任务 --- ## 链接和图片 ### 链接语法 [普通链接](https://example.com) [带标题的链接](https://example.com "这是标题") <https://example.com> 自动链接 ### 图片语法  --- ## 代码 ### 行内代码 使用 `console.log()` 输出内容。 ### JavaScript 代码块 ```javascript // 斐波那契数列 function fibonacci(n) { if (n <= 1) return n; return fibonacci(n - 1) + fibonacci(n - 2); } console.log(fibonacci(10)); // 输出: 55 ``` ### Python 代码块 ```python # 快速排序算法 def quicksort(arr): if len(arr) <= 1: return arr pivot = arr[len(arr) // 2] left = [x for x in arr if x < pivot] middle = [x for x in arr if x == pivot] right = [x for x in arr if x > pivot] return quicksort(left) + middle + quicksort(right) print(quicksort([3,6,8,10,1,2,1])) ``` ### TypeScript 代码块 ```typescript interface User { id: number; name: string; email: string; } const getUser = async (id: number): Promise<User> => { const response = await fetch(`/api/users/${id}`); return response.json(); }; ``` ### CSS 代码块 ```css .container { display: flex; justify-content: center; align-items: center; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-radius: 8px; padding: 20px; } ``` ### JSON 数据 ```json { "name": "Markdown工具", "version": "3.0.0", "features": ["实时预览", "多主题", "语法高亮"], "active": true } ``` ### Bash 命令 ```bash # 安装依赖 npm install # 启动开发服务器 npm run dev # 构建生产版本 npm run build ``` --- ## 引用 ### 单层引用 > 这是一个引用块。 > 可以包含多行内容。 ### 嵌套引用 > 第一层引用 >> 第二层嵌套引用 >>> 第三层嵌套引用 ### 引用中的其他元素 > #### 引用中的标题 > - 列表项 1 > - 列表项 2 > > **粗体文本** 和 *斜体文本* --- ## 表格 ### 基础表格 | 姓名 | 年龄 | 职业 | |------|------|------| | 张三 | 25 | 工程师 | | 李四 | 30 | 设计师 | | 王五 | 28 | 产品经理 | ### 对齐方式 | 左对齐 | 居中对齐 | 右对齐 | |:-------|:--------:|-------:| | 左 | 中 | 右 | | 文本 | 文本 | 文本 | ### 复杂表格 | 功能 | 免费版 | 专业版 | 企业版 | |------|--------|--------|--------| | 实时预览 | ✅ | ✅ | ✅ | | 基础主题 | 3个 | 10个 | 无限制 | | 语法高亮 | ✅ | ✅ | ✅ | | 自定义CSS | ❌ | ✅ | ✅ | | AI助手 | ❌ | ✅ | ✅ | | 批量转换 | ❌ | ❌ | ✅ | | API支持 | ❌ | ❌ | ✅ | --- ## 其他元素 ### 分隔线 使用三个或更多的 - 或 * 或 _ 创建分隔线: --- *** ___ ### 转义字符 使用反斜杠转义特殊字符:* # [ ] ### HTML 元素 支持部分 HTML 标签: <div style="background-color: #f0f0f0; padding: 10px; border-radius: 5px;"> 这是一个 HTML div 元素 </div> <kbd>Ctrl</kbd> + <kbd>C</kbd> 复制 <mark>高亮文本</mark> ### 脚注 这是一个带脚注的句子[^1]。 这是另一个脚注[^2]。 [^1]: 这是第一个脚注的内容。 [^2]: 这是第二个脚注的内容,可以包含**格式化文本**。 --- ## 表情符号 支持 Emoji:😀 😃 😄 😁 🎉 🚀 💡 ⭐ ❤️ 👍 技术相关:💻 🖥️ ⌨️ 🖱️ 📱 🔧 🔨 ⚙️ --- ## 总结 这个示例涵盖了 Markdown 的所有主要语法元素: 1. ✅ **文本格式**:粗体、斜体、删除线 2. ✅ **标题**:6个层级 3. ✅ **列表**:有序、无序、任务列表 4. ✅ **链接和图片**:多种链接方式 5. ✅ **代码**:行内代码和多语言代码块 6. ✅ **引用**:单层和嵌套引用 7. ✅ **表格**:基础表格和对齐方式 8. ✅ **其他**:分隔线、HTML、脚注、表情 **开始使用这个强大的 Markdown 工具吧!** 🚀✨
预览与代码
预览
HTML
✨ 专业功能特色
强大的Markdown转HTML工具,满足您的所有需求
实时预览
输入即时转换
10+主题
多平台主题支持
自定义主题
创建专属样式
微信公众号
专业排版样式
系统跟随
暗黑模式适配
编辑器功能
撤销/重做功能 (Ctrl+Z / Ctrl+Y)
拖放上传 Markdown 文件
搜索与替换功能 (Ctrl+F)
15+快捷插入选项
实时字数统计和阅读时间
支持删除线、高亮、脚注等扩展语法
导出选项
导出完整 HTML 文件
包含/不包含 CSS 样式
HTML 压缩选项
响应式设计支持
深色模式适配