最全的Markdown语法

Markdown是Github最常见的文档说明。Markdown的语法简洁明了、学习容易。按照官方Markdown Cheat Sheet逐个操作一遍自然就会了。

[TOC]

[TOC]
[MENU]

• 效果显示如上

# 一级标题
## 二级标题
##### 多级标题

引用与注释

> 一级引用
>> 二级引用
>>>>> n级引用

`行内代码`

• 效果行内代码

这是代码//代码中无视markdown语法，所以本文中所有展示markdown原始文本的部分都是用代码段包起来的。

这是代码
​```javascript
var s = "JavaScript syntax highlighting";
alert(s);
​```
 
​```python
s = "Python syntax highlighting"
print s
​```

​```makrdown
> 一级引用
>> 二级引用
>>>>> n级引用
​```

//-*+三个符号在无序列表中地位平等
- 第一项
* 第二项
    * 第二项//前面加一个空格或tab就表示下一级
        * 这又是一级
+ 第三项

---

• 第二项
  • 第二项//前面加一个空格或tab就表示下一级
    • 这又是一级

//数字加.加空格表示一个有序列表项，tab或空格触发下一级
1. 这是有序的
	1. 这是有序的
2. 这是有序的
	1. 这是有序的

1. 这是有序的
   1. 这是有序的
2. 这是有序的
   1. 这是有序的

行内超链接

[百度](baidu.com)

百度

参数式超链接

声明：[百度]:baidu.com
使用：进入[百度]

*斜体*
**粗体**
***斜体加粗***
~~删除线~~

斜体 粗体 斜体加粗 删除线

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |

注释：
-----: 表示右对齐
:----- 表示左对齐
:----: 表示居中对齐

Tables Are Cool col 3 is right-aligned $1600 col 2 is centered $12 zebra stripes are neat $1

![图片](图片地址)
//注意，默认图片格式是原始尺寸，如果想自定义图像大小，要用img标签：

Inline-style: 
![alt text](https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 1")

Reference-style: 
![alt text][logo]

[logo]: https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 2"

Inline-style:

Reference-style:

设置图片大小

Markdown自带功能

![loading.png](https://upload-images.jianshu.io/upload_images/6967706-0b0037793a690aeb.png?imageMogr2/auto-orient/strip|imageView2/2/w/512/format/webp?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

![loading.png](https://upload-images.jianshu.io/upload_images/6967706-0b0037793a690aeb.png?imageMogr2/auto-orient/strip|imageView2/2/w/512/format/webp?imageMogr2/auto-orient/strip%7CimageView2/2/w/200)

使用HTML <img>标签并设置width和height

<img src="https://upload-images.jianshu.io/upload_images/6967706-0b0037793a690aeb.png?imageMogr2/auto-orient/strip|imageView2/2/w/512/format/webp" alt="图片替换文本" width="500" height="313" align="bottom" />

<img src="http://upload-images.jianshu.io/upload_images/1503319-c696a9cd1495d68f.png" alt="图片替换文本" width="500" height="313" align="bottom" />

- [x] A
- [ ] B
- [x] 已选中
- [ ] 未选中

- [ ] 支持以 PDF 格式导出文稿
- [ ] 改进 Cmd 渲染算法，使用局部渲染技术提高渲染效率
- [x] 新增 Todo 列表功能
- [x] 修复 LaTex 公式渲染问题
- [x] 新增 LaTex 公式编号功能

• [x] 已选中

• [ ] 未选中

• [ ] 支持以 PDF 格式导出文稿

• [ ] 改进 Cmd 渲染算法，使用局部渲染技术提高渲染效率

• [x] 新增 Todo 列表功能

• [x] 修复 LaTex 公式渲染问题

• [x] 新增 LaTex 公式编号功能

脚注 (footnote)

文章正文某处[^脚注id]文章正文
[^脚注id]: 脚注内容

文章正文某处^脚注id文章正文

​```flow
st=>start: Start :>https://amwiki.xf09.net[blank]
e=>end: End :>https://amwiki.xf09.net[blank]
op1=>operation: My Operation
op2=>operation: Stuff
sub1=>subroutine: My Subroutine
cond=>condition: Yes or No? :>https://amwiki.xf09.net[blank]
c2=>condition: Good idea
io=>inputoutput: catch something...

st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e
​```

流程图语法介绍

流程图语法分两个部分，一个是声明元素，一个是定义流程

tag=>type: content :>url

1. tag 设置元素名称
2. => 元素定义符
3. type: 设置元素类型，共分6种：

• start：开始，圆角矩形
• end：结束，圆角矩形
• operation：操作/行动方案，普通矩形
• subroutine：子主题/模块，双边线矩形
• condition：条件判断/问题审核，菱形
• inputoutput：输入输出，平行四边形

1. content 设置元素显示内容，中英均可

2. :>url 设置元素连接，可选，后接 [blank] 可以新建窗口打开

提示：注意空格，=> 前后都不能接空格；type: 后必须接空格；:> 是语法标记，中间不能有空格

tag1(branch,direction)->tag2

1. -> 流程定义符，连接两个元素
2. branch 设置 condition 类型元素的两个分支，有 yes/no 两个值，其他元素无效
3. direction 定义流程走线方向，有 left/right/top/bottom 四个值，所有元素有效，此项配置可选 （PS: 此属性目前有一定几率触发图形错位，刷新即可）

• 继续注意空格，-> 前后都不能有空格

• 由于 condition 类型有两个分支，我们一般遇到 condition 元素就换行书写，比如：

    st->op1-c2
    c2(yes)->io->e
    c2(no)->op2->e