Markdown指南
Markdown简介
Markdown是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。
可查看【百度百科】深入了解。也可以查阅【官方文档】进行学习。
本博文的原文可以【点击下载】，然后复制到自己发布博客园Markdown文章，转载请注明本文地址。
标题
对于博客园文章，建议从"##"这种二级标题开始，看起来比较美观。在Markdown首行填写[toc]即可自动识别#号的标题作为目录。
[toc]
# 这是 H1
## 这是 H2
### 这是 H3
#### 这是 H4
##### 这是 H5
###### 这是 H6
最多6级标题
段落
段落换行
- 行尾添加两个以上空格加换行符实现。
- 用一个空行简单的将两段落隔开。
- 可以输入
<br/>实现换行。
段落缩进
 来表示一个全角空格。 表示一个半角空格。 表示行中间的空格。
字体格式
- 斜体文本，
*斜体文本*：斜体文本；或者<i>斜体文本</i>：斜体文本；或者<em>斜体文本</em>：斜体文本。 - 粗体文本，
**粗体文本**：粗体文本。或者<b>粗体文本</b>：粗体文本。 - 粗斜体文本，
***粗斜体文本***：粗斜体文本。 - 分割线，一行中用三个以上的星号、减号、底线来建立一个分隔线。
- 可以使用
<font color=#db3737 size=3>文字</font>来定义文字的大小和颜色。文字 - 删除线，
~~删除线~~，删除线。或者用<s>删除线</s>，删除线。 - 下划线，
<u>下划线</u>，下划线。 - 文本居中，
<center>居中文本</center>，居中文本 。注意，在使用center后的文本独占一行。 - 脚注，首先要定义脚注: "[^LABEL]: "，在引用处使用[^LABEL]即可[1]。
创建脚注格式类似这样 [^janbar]。
[^janbar]: 记录生活的美好！
插入链接
普通链接
链接使用方法如下：
[链接名称](链接地址)
或者
<链接地址>
例如：
这是一个链接 [点击跳转](https://www.cnblogs.com/janbar)
效果如下：
这是一个链接 点击跳转
直接使用链接地址：
<https://www.baidu.com>
<address@example.com>
效果如下：
https://www.baidu.com
address@example.com
高级链接
我们可以通过变量来设置一个链接，变量赋值在文档末尾进行：
这个链接用 1 作为网址变量 [Google][1]
这个链接用 janbar 作为网址变量 [Janbar][janbar]
然后在文档的结尾为变量赋值（网址），记得文末加空行和前2个空格。
.
[1]: http://www.google.com/
[janbar]: https://www.cnblogs.com/janbar
效果如下：
这个链接用 1 作为网址变量 Google
这个链接用 janbar 作为网址变量 Janbar
插入图片
- 借助 Markdown 提供的 alt 标签实现：
![alt 属性文本](图片地址 "可选标题" =30x30)可选标题项可省略，最后的表达式可以限定图片大小。 - 借助 html 提供的
<img> 标签实现： <img src="图片地址" width="50%"></img>，可以添加 img 标签支持的样式及属性。 - 借助 html 提供的
<img> 标签和 <div>标签实现图片居中。 - 当然，你也可以像插入高级链接那样对图片网址使用变量，在文末放上链接就行。
插入代码块
-
行内插入某个函数或这一行代码，用"`"括起来即可。我一般也用这个当做着重符，重点突出某些文字。
-
一整块代码，可以在每行代码前加4个空格或1个tab。注意：起止行要与其他部分加空行隔开。
#include <stdio.h> int main(int argc,char *argv[]) { return 0; } -
使用两行三个"`"把代码包括起来，带上代码语言，有些Markdown解释器会根据语言不同而进行不同的渲染。我一般都是用这个。
```c
#include <stdio.h>
int main(int argc,char *argv[])
{
return 0;
}
```
插入表格
基础用法
Markdown 制作表格使用 | 来分隔不同的单元格，使用 - 来分隔表头和其他行。语法格式如下：
| 表头 | 表头 |
| ---- | ---- |
| 单元格 | 单元格 |
| 单元格 | 单元格 |
以上代码显示结果如下：
| 表头 | 表头 | 表头 |
|---|---|---|
| 单元格 | 单元格 | 单元格 |
| 单元格 | 单元格 | 单元格 |
对齐方式
- -: 设置内容和标题栏居右对齐。
- :- 设置内容和标题栏居左对齐。
- :-: 设置内容和标题栏居中对齐。
实例如下：
| 左对齐 | 右对齐 | 居中对齐 |
| :-----| ----: | :----: |
| 单元格11111111111111 | 单元格222222222222222222 | 单元格33333333333333333 |
| 单元格11111111111111 | 单元格222222222222222222 | 单元格33333333333333333 |
效果如下：
| 左对齐 | 右对齐 | 居中对齐 |
|---|---|---|
| 单元格11111111111111 | 单元格222222222222222222 | 单元格33333333333333333 |
| 单元格11111111111111 | 单元格222222222222222222 | 单元格33333333333333333 |
插入区块
基础用法
如下格式用">"加空格实现。可以用多个嵌套区块。
> 最外层
> > 第一层嵌套
> > > 第二层嵌套
效果如下：
最外层
第一层嵌套
第二层嵌套
区块中使用列表
> 区块中使用列表
> 1. 第一项
> 2. 第二项
> + 第一项
> + 第二项
> + 第三项
效果如下：
区块中使用列表
- 第一项
- 第二项
- 第一项
- 第二项
- 第三项
列表中使用区块
- 第一项
> 技术大佬
> 学的不仅是技术更是梦想- 第二项
效果如下：
- 第一项
技术大佬
学的不仅是技术更是梦想 - 第二项
插入列表
无序列表
无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记，这些标记后面要添加一个空格，然后再填写内容：
* 第一项
* 第二项
* 第三项
+ 第一项
+ 第二项
+ 第三项
- 第一项
- 第二项
- 第三项
效果如下：
- 第一项
- 第二项
- 第三项
- 第一项
- 第二项
- 第三项
- 第一项
- 第二项
- 第三项
有序列表
有序列表使用数字并加上 . 号来表示，如：
- 第一项
- 第二项
- 第三项
效果如下：
- 第一项
- 第二项
- 第三项
列表嵌套
列表嵌套只需在子列表中的选项前面添加四个空格即可：
- 第一项：
- 第一项嵌套的第一个元素
- 第一项嵌套的第二个元素- 第二项：
- 第二项嵌套的第一个元素
- 第二项嵌套的第二个元素
效果如下：
- 第一项：
- 第一项嵌套的第一个元素
- 第一项嵌套的第二个元素
- 第二项：
- 第二项嵌套的第一个元素
- 第二项嵌套的第二个元素
插入待办
已经验证博客园的Markdown不支持如下待办样式。但是像GitHub上是可以使用如下样式的。
- [ ] 未完成
- [x] 已完成
实际效果如下：
隐藏内容
当需要隐藏内容，点击箭头才能展开进行展示，可以使用如下方法。
<details>
<summary>点此展开格式化示例。</summary>
<br>
展示内容
</details>
实际效果如下：
点此展开格式化示例。
展示内容
高级技巧
HTML 元素
不在 Markdown 涵盖范围之内的标签，都可以直接在文档里面用 HTML 撰写。
目前支持的 HTML 元素有：<kbd> <b> <i> <em> <sup> <sub> <br>等 ，如：
使用
<kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd>重启电脑
显示结果如下：
使用 Ctrl+Alt+Del 重启电脑
转义
Markdown 使用了很多特殊符号来表示特定的意义，如果需要显示特定的符号则需要使用转义字符，Markdown 使用反斜杠转义特殊字符：
文本加粗
\*\* 正常显示星号 \*\*
Markdown 支持以下这些符号前面加上反斜杠来帮助插入普通的符号：
\ 反斜线
` 反引号
* 星号
_ 下划线
{} 花括号
[] 方括号
() 小括号
# 井字号
+ 加号
- 减号
. 英文句点
! 感叹号
公式
当你需要在编辑器中插入数学公式时，可以使用两个美元符 $$ 包裹 TeX 或 LaTeX 格式的数学公式来实现。提交后，问答和文章页会根据需要加载 Mathjax 对数学公式进行渲染。如：
$$
\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix}
\mathbf{i} & \mathbf{j} & \mathbf{k} \\
\frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\
\frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \\
\end{vmatrix}
${$tep1}{\style{visibility:hidden}{(x+1)(x+1)}}
$$
效果如下：
甘特图
```mermaid
gantt
dateFormat YYYY-MM-DD
title Adding GANTT diagram functionality to mermaid
section 现有任务
已完成 :done, des1, 2014-01-06,2014-01-08
进行中 :active, des2, 2014-01-09, 3d
计划中 : des3, after des2, 5d
```
效果如下：
UML 图
```mermaid
sequenceDiagram
张三 ->> 李四: 你好！李四, 最近怎么样?
李四-->>王五: 你最近怎么样，王五？
李四--x 张三: 我很好，谢谢!
李四-x 王五: 我很好，谢谢!
Note right of 王五: 李四想了很长时间, 文字太长了
不适合放在一行.李四-->>张三: 打量着王五...
张三->>王五: 很好... 王五, 你怎么样?
```
效果如下：
Mermaid流程图
```mermaid
graph LR
A[长方形] -- 链接 --> B((圆))
A --> C(圆角长方形)
B --> D{菱形}
C --> D
```
效果如下：
Flowchart流程图
```mermaid
flowchat
st=>start: 开始
e=>end: 结束
op=>operation: 我的操作
cond=>condition: 确认？st->op->cond
cond(yes)->e
cond(no)->op
```
效果如下：
类图
```mermaid
classDiagram
Class01 <|-- AveryLongClass : Cool
<> Class01
Class09 --> C2 : Where am i?
Class09 --* C3
Class09 --|> Class07
Class07 : equals()
Class07 : Object[] elementData
Class01 : size()
Class01 : int chimp
Class01 : int gorilla
class Class10 {
>>service>>
int id
size()
}
```
效果如下：
插入svg
众所周知Markdown支持嵌入html元素，那么svg文本也是支持的，下面就嵌入一个圆形的svg图片。
<div width="100%" style="overflow-x: auto;">
<svg width="140" height="170">
<title>SVG Sample</title>
<desc>This is a sample to use SVG in markdown on the website cnblogs.</desc>
<circle cx="70" cy="95" r="50" style="stroke: black; fill: none;"/>
</svg>
</div>
效果如下：
脚注
记录生活的美好！ ↩︎
