Markdown转HTML工具

功能强大的在线工具，支持实时预览、多种主题、AI助手等专业功能

实时预览

10+主题

自定义主题

跟随系统

微信公众号

搜索替换

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> 自动链接

### 图片语法
![Markdown Logo](https://picsum.photos/400/200 "示例图片")

---

## 代码

### 行内代码
使用 `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 标签：

<kbd>Ctrl</kbd> + <kbd>C</kbd> 复制

### 脚注
这是一个带脚注的句子[^1]。

这是另一个脚注[^2]。

[^1]: 这是第一个脚注的内容。
[^2]: 这是第二个脚注的内容，可以包含**格式化文本**。

---

## 表情符号

支持 Emoji：😀 😃 😄 😁 🎉 🚀 💡 ⭐ ❤️ 👍

技术相关：💻 🖥️ ⌨️ 🖱️ 📱 🔧 🔨 ⚙️

---

## 总结

这个示例涵盖了 Markdown 的所有主要语法元素：

1. ✅ **文本格式**：粗体、斜体、删除线
2. ✅ **标题**：6个层级
3. ✅ **列表**：有序、无序、任务列表
4. ✅ **链接和图片**：多种链接方式
5. ✅ **代码**：行内代码和多语言代码块
6. ✅ **引用**：单层和嵌套引用
7. ✅ **表格**：基础表格和对齐方式
8. ✅ **其他**：分隔线、HTML、脚注、表情

**开始使用这个强大的 Markdown 工具吧！** 🚀✨

预览与代码

✨ 专业功能特色

强大的Markdown转HTML工具，满足您的所有需求

实时预览

输入即时转换

10+主题

多平台主题支持

自定义主题

创建专属样式

微信公众号

专业排版样式

系统跟随

暗黑模式适配

编辑器功能

撤销/重做功能 (Ctrl+Z / Ctrl+Y)
拖放上传 Markdown 文件
搜索与替换功能 (Ctrl+F)
15+快捷插入选项
实时字数统计和阅读时间
支持删除线、高亮、脚注等扩展语法

导出选项

导出完整 HTML 文件
包含/不包含 CSS 样式
HTML 压缩选项
响应式设计支持
深色模式适配