Markdown 文档预览

Markdown 源码

# 一级标题

## 二级标题

### 三级标题

#### 四级标题

##### 五级标题

###### 六级标题

---

## 文本样式

**加粗文字**、*斜体文字*、***加粗斜体***、~~删除线~~、`行内代码`、<u>下划线</u>、[链接文字](https://example.com)、脚注[^1]

[^1]: 这是脚注内容。

---

## 列表

### 无序列表

- 列表项一
- 列表项二
  - 嵌套项 2.1
  - 嵌套项 2.2
- 列表项三

### 有序列表

1. 第一项
2. 第二项
   1. 嵌套项 2.1
   2. 嵌套项 2.2
3. 第三项

### 任务列表

- [x] 已完成任务
- [ ] 未完成任务

---

## 引用

> 这是一段引用文字。

> 这是多行引用。
> 第二行引用内容。
>
> > 这是嵌套引用。

---

## 代码

行内代码：使用 `console.log("hello")` 输出内容。

### 代码块（JavaScript）

```javascript
function greet(name) {
  // 这是一段注释
  console.log(`Hello, ${name}!`);
  return name;
}
```

### 代码块（Java）

```java
public class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello, World!");
    }
}
```

### 代码块（SQL）

```sql
SELECT id, name, created_at
FROM users
WHERE status = 'active'
ORDER BY created_at DESC;
```

---

## 表格

### 普通表格

| 姓名 | 年龄 | 城市 |
|------|------|------|
| 张三 | 25 | 北京 |
| 李四 | 30 | 上海 |

### 带对齐的表格

| 左对齐 | 居中对齐 | 右对齐 |
|:-------|:--------:|-------:|
| 内容 A | 内容 B | 内容 C |
| 1 | 2 | 3 |

---

## 分割线

上面是内容。

---

下面是另一段内容。

## 图片

![示例图片](https://via.placeholder.com/300x150)

---

## Mermaid 流程图

```mermaid
flowchart TD
    A[开始] --> B{条件判断}
    B -->|是| C[执行操作]
    B -->|否| D[其他处理]
    C --> E[结束]
    D --> E
```

## Mermaid 时序图

```mermaid
sequenceDiagram
    participant 用户
    participant 系统
    用户->>系统: 发起请求
    系统-->>用户: 返回结果
```

## Mermaid 状态图

```mermaid
stateDiagram-v2
    [*] --> 空闲
    空闲 --> 运行中: 开始
    运行中 --> 空闲: 停止
    运行中 --> [*]: 完成
```