本文最后更新于2025年06月16日；如遇到问题，请及时留言告知。

Markdown是一种简单的格式化文本的方法，在任何设备上看起来都很棒。它不会做任何花哨的事情，比如改变字体大小、颜色或类型——只是基本的，使用你已经知道的键盘符号。————摘自百度百科

作为新手不熟悉 Markdown 怎么写？下面内容是博主汇集多方来源整理出的内容，不同解析库呈现出的效果会有差异，示例仅供参考。

0. 目录

使用 [TOC] 来标示插入目录，目录分级取决于文章已有的分级标题。

最高层级不一定要从一级标题开始，目录解析过程会自动识别整个目录的最高层级。

示例：

[TOC]

0. 目录
1. 分级标题
这是一级标题
- 这是二级标题
  - 这是三级标题
    - 这是四级标题
      - 这是五级标题
        
        这是六级标题
2. 删除线、斜体、粗体、粗斜体
3. 上标与下标
4. 缩写(同HTML的abbr标签)
5. 文字引用
6. 链接
7. 列表
- 无序列表
  - 无序列表（减号）
  - 无序列表（加号）
- 有序列表
8. 行内代码块
9. 预格式化文本
- JS代码
- HTML 代码
10. 图片
11. 横线
12. 表格
13. 特殊符号
14. 反斜杠
15. LaTeX 公式
16. Mermaid
- Entity Relationship Diagrams
- Sequence Diagram
- State Diagrams
- Flowchart
- Gantt Diagrams
- Quadrant Chart
- Graph
- XY Chart
17. 文本高亮
18. 任务列表
19. 注脚

1. 分级标题

在行首加不同数量的 # 表示不同级别的标题 (h1-h6)。

最高层级不一定要从一级标题开始，目录解析过程会自动识别整个目录的最高层级。

示例：

# 这是一级标题
## 这是二级标题
### 这是三级标题
#### 这是四级标题
##### 这是五级标题
###### 这是六级标题

这是一级标题

这是二级标题

这是三级标题

这是四级标题

这是五级标题

这是六级标题

2. 删除线、斜体、粗体、粗斜体

使用 ~~ 、* 或_、**或__ 分别表示删除线、斜体和粗体。

示例：

~~这是删除线~~     <s>这是删除线（开启识别HTML标签时）</s>
*这是斜体字*       _这是斜体字_
**这是粗体**       __这是粗体__
***这是粗斜体***   ___这是粗斜体___

~~这是删除线~~ ~~删除线（开启识别HTML标签时）~~ 这是斜体字 这是斜体字 这是粗体 这是粗体 这是粗斜体 这是粗斜体

3. 上标与下标

使用成对的 HTML 标签 <sub></sub> 与<sup></sup>分别表示上标与下标。

示例：

上标：X<sub>2</sub>，下标：O<sup>2</sup>

上标：X₂，下标：O²

4. 缩写(同HTML的abbr标签)

即更长的单词或短语的缩写形式，前提是开启识别HTML标签时。

示例：

The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>.

The HTML specification is maintained by the W3C.

5. 文字引用

使用 > 表示文字引用。

示例：

> 引用文本 Blockquotes

引用文本 Blockquotes

6. 链接

使用 [描述](链接地址) 为文字增加外链接。

示例：

[普通链接](http://localhost/)

普通链接

[普通链接带标题](http://localhost/ "普通链接带标题")

普通链接带标题

直接链接：<https://stiny.cn>

直接链接：https://stiny.cn

[锚点链接][链接标记1] 
[链接标记1]: http://www.this-anchor-link.com/

[锚点链接][链接标记1] [链接标记1]: http://www.this-anchor-link.com/

7. 列表

无序列表

使用 -（减号），*（星号），+ （加号) 表示无序列表。

示例：

无序列表（减号）

- 列表一
- 列表二
- 列表三

列表一
列表二
列表三

无序列表（加号）

+ 列表一
+ 列表二
+ 列表三

列表一
列表二
列表三

有序列表

使用数字和点表示有序列表。

1. 第一行
2. 第二行
3. 第三行

第一行
第二行
第三行

8. 行内代码块

示例：

执行命令：`npm install marked`

执行命令：npm install marked

9. 预格式化文本

即缩进四个空格，也做为实现类似<pre>预格式化文本(Preformatted Text)的功能。

示例：

| 第一个标题  | 第二个标题 |
| ------------- | ------------- |
| 单元格内容  | 单元格内容  |
| 单元格内容  | 单元格内容  |

JS代码

javascript
function test() {
    console.log("Hello world!");
}

HTML 代码

```html
<!DOCTYPE html>
<html>
    <head>
        <mate charest="utf-8" />
        <meta name="keywords" content="Editor.md, Markdown, Editor" />
		……

<!DOCTYPE html>
<html>
    <head>
        <mate charest="utf-8" />
        <meta name="keywords" content="Editor.md, Markdown, Editor" />
        <title>Hello world!</title>
        <style type="text/css">
            body{font-size:14px;color:#444;font-family: "Microsoft Yahei", Tahoma, "Hiragino Sans GB", Arial;background:#fff;}
            ul{list-style: none;}
            img{border:none;vertical-align: middle;}
        </style>
    </head>
    <body>
        <h1 class="text-xxl">Hello world!</h1>
        <p class="text-green">Plain text</p>
    </body>
</html>

10. 图片

使用 ![描述](图片链接地址) 插入图像。

示例：

![博客插图](https://blog.stiny.cn/usr/uploads/2021/05/2580035500.png?key=1df86d49bc7266ca58a2fee6a22aa4c9&t=1763080211)

博客插图

图片加链接：

[![关于博客](https://blog.stiny.cn/usr/uploads/2021/05/2579866084.png?key=71f1b1129d419cdbc24b6bce2911227a&t=1763080211)](https://blog.stiny.cn/about.html "关于博客")

11. 横线

使用----插入分隔横线。

示例：

----

12. 表格

示例：

| 项目        | 价格    |  数量  |
| --------   | -----:  | :----: |
| 计算机      | ￥5900  |   5    |
| 手机        | ￥2512  |   12   |

项目	价格	数量
计算机	￥5900	5
手机	￥2512	12

|  左对齐  |  居中对齐  |  右对齐  |
| :------- |:---------:| -------:|
| 单元格1   | 单元格4   | 单元格7 |
| 单元格2   | 单元格5   | 单元格8 |
| 单元格3   | 单元格6   | 单元格9 |

左对齐	居中对齐	右对齐
单元格1	单元格4	单元格7
单元格2	单元格5	单元格8
单元格3	单元格6	单元格9

13. 特殊符号

14. 反斜杠

示例：

\*文字星号\*

*文字星号*

15. LaTeX 公式

使用 $ 和 $$ 包裹公式内容，分别代表行内公式和公式块。

示例：

这是一个行内公式：$$E=mc^2$$

这是一个公式块：
<div>$$
F^{HLLC}=\left\{
\begin{array}{rcl}
F_L       &      & {0      <      S_L}\\
F^*_L     &      & {S_L \leq 0 < S_M}\\
F^*_R     &      & {S_M \leq 0 < S_R}\\
F_R       &      & {S_R \leq 0}
\end{array} \right.
$$</div>

这是一个行内公式：$$E=mc^2$$

这是一个公式块：

$$ F^{HLLC}=\left\{ \begin{array}{rcl} F_L & & {0 < S_L}\\ F^*_L & & {S_L \leq 0 < S_M}\\ F^*_R & & {S_M \leq 0 < S_R}\\ F_R & & {S_R \leq 0} \end{array} \right. $$

16. Mermaid

Entity Relationship Diagrams

```mermaid
erDiagram
    CUSTOMER ||--o{ ORDER : places
    ORDER ||--|{ LINE-ITEM : contains
    CUSTOMER }|..|{ DELIVERY-ADDRESS : uses 
```

erDiagram
CUSTOMER ||--o{ ORDER : places
ORDER ||--|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses

Sequence Diagram

```mermaid
sequenceDiagram
	Alice ->> Bob: Hello Bob, how are you?
	Bob-->>John: How about you John?
	Bob--x Alice: I am good thanks!
	Bob-x John: I am good thanks!
	Note right of John: Bob thinks a longlong time, so longthat the text doesnot fit on a row.

	Bob-->Alice: Checking with John...
	Alice->John: Yes... John, how are you?
```

sequenceDiagram
    Alice ->> Bob: Hello Bob, how are you?
    Bob-->>John: How about you John?
    Bob--x Alice: I am good thanks!
    Bob-x John: I am good thanks!
    Note right of John: Bob thinks a longlong time, so longthat the text doesnot fit on a row.

    Bob-->Alice: Checking with John...
    Alice->John: Yes... John, how are you?

State Diagrams

```mermaid
stateDiagram
    [*] --> Still
    Still --> [*]

    Still --> Moving
    Moving --> Still
    Moving --> Crash
    Crash --> [*]
```

stateDiagram
    [*] --> Still
    Still --> [*]

    Still --> Moving
    Moving --> Still
    Moving --> Crash
    Crash --> [*]

Flowchart

```mermaid
flowchart LR
	A[Hard edge] -->|Link text| B(Round edge)
	B --> C{Decision}
	C -->|One| D[Result one]
	C -->|Two| E[Result two]
```

flowchart LR
    A[Hard edge] -->|Link text| B(Round edge)
    B --> C{Decision}
    C -->|One| D[Result one]
    C -->|Two| E[Result two]

Gantt Diagrams

```mermaid
gantt
	title A Gantt Diagram
	dateFormat  YYYY-MM-DD
	section Section
	A task           :a1, 2014-01-01, 30d
	Another task     :after a1  , 20d
	section Another
	Task in sec      :2014-01-12  , 12d
	another task      : 24d
```

gantt
    title A Gantt Diagram
    dateFormat  YYYY-MM-DD
    section Section
    A task           :a1, 2014-01-01, 30d
    Another task     :after a1  , 20d
    section Another
    Task in sec      :2014-01-12  , 12d
    another task      : 24d

Quadrant Chart

```mermaid
quadrantChart
	title Reach and engagement of campaigns
	x-axis Low Reach --> High Reach
	y-axis Low Engagement --> High Engagement
	quadrant-1 We should expand
	quadrant-2 Need to promote
	quadrant-3 Re-evaluate
	quadrant-4 May be improved
	Campaign A: [0.3, 0.6]
	Campaign B: [0.45, 0.23]
	Campaign C: [0.57, 0.69]
	Campaign D: [0.78, 0.34]
	Campaign E: [0.40, 0.34]
	Campaign F: [0.35, 0.78]
```

quadrantChart
    title Reach and engagement of campaigns
    x-axis Low Reach --> High Reach
    y-axis Low Engagement --> High Engagement
    quadrant-1 We should expand
    quadrant-2 Need to promote
    quadrant-3 Re-evaluate
    quadrant-4 May be improved
    Campaign A: [0.3, 0.6]
    Campaign B: [0.45, 0.23]
    Campaign C: [0.57, 0.69]
    Campaign D: [0.78, 0.34]
    Campaign E: [0.40, 0.34]
    Campaign F: [0.35, 0.78]

Graph

```mermaid
graph LR
A[Square Rect] -- Link text --> B((Circle))
A --> C(Round Rect)
B --> D{Rhombus}
C -->
D
```

graph LR
A[Square Rect] -- Link text --> B((Circle))
A --> C(Round Rect)
B --> D{Rhombus}
C -->
D

XY Chart

```mermaid
xychart-beta
	title "Sales Revenue"
	x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
	y-axis "Revenue (in $)" 4000 --> 11000
	bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
	line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
```

xychart-beta
    title "Sales Revenue"
    x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
    y-axis "Revenue (in $)" 4000 --> 11000
    bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
    line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]

17. 文本高亮

这句话里面==STINY==被高亮标记了。

这句话里面STINY被高亮标记了。

18. 任务列表

- [x] Typecho 最新版本插件系统适配
- [x] MarkdownParse 适配 GFM
- [ ] MarkdownParse 发布 2.0 版本

Typecho 最新版本插件系统适配
MarkdownParse 适配 GFM
MarkdownParse 发布 2.0 版本

19. 注脚

本文主要内容参考了 Typecho Markdown 插件原作者的博文[^1]以及开源在线 Markdown 编辑器 Editor.md 提供的演示示例[^2]。

[^1]: 参考博文地址：https://www.chengxiaobai.cn/record/markdown-concise-grammar-manual.html
[^2]: Editor.md地址：https://pandao.github.io/editor.md/

本文主要内容参考了 Typecho Markdown 插件原作者的博文¹以及开源在线 Markdown 编辑器 Editor.md 提供的演示示例²。

参考博文地址：https://www.chengxiaobai.cn/record/markdown-concise-grammar-manual.html ↩
Editor.md 地址：https://pandao.github.io/editor.md/ ↩

MarkDown 简明语法手册