Markdown

標題

# 一級標題
## 二級標題
### 三級標題
#### 四級標題
##### 五級標題

換行

[1]. 連續敲擊兩下「Return」鍵，再開始寫下一段；
[2]. 在行末添加兩個空格符，然後「Return」（爲了顯示清晰），開始寫下一段。

字體

<font face="黑體">我是黑體字</font>
<font face="微軟雅黑">我是微軟雅黑</font>
<font face="STCAIYUN">我是華文彩雲</font>
<font color=#0099ff size=5 face="黑體">color=#0099ff size=5 face="黑體"</font>
<font color=#00ffff size=5>color=#00ffff size=5</font>
<font color=gray size=5>color=gray size=5</font>

我是黑體字
我是微軟雅黑
我是華文彩雲
color=#0099ff size=5 face="黑體"
color=#00ffff size=5
color=gray size=5

強調

*斜體* 斜體
_斜體_

**加粗** 加粗
__粗體__

***斜體並加粗*** 斜體並加粗
___斜體並加粗___

分割線

*** 加分割線
* * * 能夠這樣
***** 也能夠這樣
--- 還能夠這樣
___ 這樣也能夠

代碼

[1]. 用三個反引號把代碼包裹起來
[2]. 首行開頭縮進四個空格符，或敲一下 tab 鍵（製表符鍵）。

表格

| header1 | header2 | header3 |
| :-- | :---: | ---: |
| 居左 | 居中 | 居右 |

header1	header2	header3
居左	居中	居右

連接

[連接描述](連接url)

列表

有序（數字+.+空格）
1. option1
2. option2
3. option3

無序（-或者*）
- option1
- option2

有序

1. option1
2. option2
3. option3

無序

• option1
• option2

清單

[x] option1
[x] option2

流程圖

  如何在 Markdown 中畫流程圖呢？固然是用mermaid了，mermaid支持三種圖形的繪製，分別是流程圖，時序圖和甘特圖。

```mermaid
graph 流程圖方向
流程圖內容


流程圖方向有下面幾個值:
·TB 從上到下
·BT 從下到上
·RL 從右到左
·LR 從左到右
·TD 同TB

基本圖形:
id + [文字描述]矩形
id + (文字描述)圓角矩形
id + >文字描述]不對稱的矩形
id + {文字描述}菱形
id + ((文字描述))圓形

節點之間的鏈接
A --> B A帶箭頭指向B
A --- B A不帶箭頭指向B
A -.- B A用虛線指向B
A -.-> B A用帶箭頭的虛線指向B
A ==> B A用加粗的箭頭指向B
A -- 描述 --- B A不帶箭頭指向B並在中間加上文字描述
A -- 描述 --> B A帶箭頭指向B並在中間加上文字描述
A -. 描述 .- B  A用不帶箭頭的虛線指向B並在中間加上文字描述
A -. 描述 .-> B A用帶箭頭的虛線指向B並在中間加上文字描述
A == 描述 ==> B A用加粗的箭頭指向B並在中間加上文字描述

子流程圖
subgraph title
    graph definition
end

自定義樣式
style id 具體樣式

實例1

```mermaid
graph TD
	A --> B
	A -.- C
	A --- D
	A ==> E
	A -.-> F
	A -. 描述 .- G

實例2

```mermaid
graph TB
    c1-->a2
    subgraph one
    a1-->a2
    end
    subgraph two
    b1-->b2
    end
    subgraph three
    c1-->c2
    end

實例3

```mermaid
graph LR
    id1(Start)-->id2(Stop)
    style id1 fill:#f9f,stroke:#333,stroke-width:4px,fill-opacity:0.5
    style id2 fill:#ccf,stroke:#f66,stroke-width:2px,stroke-dasharray: 10,5

實例4

```mermaid
graph LR
    start[開始] --> input[輸入A,B,C]
    input --> conditionA{A是否大於B}
    conditionA -- YES --> conditionC{A是否大於C}
    conditionA -- NO --> conditionB{B是否大於C}
    conditionC -- YES --> printA[輸出A]
    conditionC -- NO --> printC[輸出C]
    conditionB -- YES --> printB[輸出B]
    conditionB -- NO --> printC[輸出C]
    printA --> stop[結束]
    printC --> stop
    printB --> stop

引用

> 周杰倫《等你下課》

> 你住的巷子裏 
> 我租了一間公寓 
> 爲了想與你不期而遇 
> 高中三年
> > 我爲何
> > > 爲何很差好讀書
> > >
> > > > 沒考上和你同樣的大學

周杰倫《等你下課》

你住的巷子裏 我租了一間公寓 爲了想與你不期而遇 高中三年

我爲何

爲何很差好讀書

沒考上和你同樣的大學

錨點

腳註

表情

圖片

圖片

![圖片描述](圖片路徑)
<img src="圖片路徑" width="圖片寬度（px或者%或者auto）" height="圖片高度（px或者%或者auto）" alt="圖片描述" title="圖片標題">

並排

單張居中

單張居中
<center>
    <img src="xxx.png">
</center>
<div align=center>
    <img src ="xxx.png"/>
</div>

單張居左
<figure>
    <img src="http://xxx.jpg">
</figure>
<div align=left>
    <img src ="xxx.png"/>
</div>

兩張並排

兩張並排並居左
<figure class="half">
    <img src="http://xxx.jpg">
    <img src="http://yyy.jpg">
</figure>

兩張並排並居中
<center class="half">
    <img src="http://xxx.jpg">
    <img src="http://yyy.jpg">
</center>

三張並排

三張並排居左
<figure class="third">
    <img src="http://xxx.jpg">
    <img src="http://yyy.jpg">
    <img src="http://zzz.jpg">
</figure>

三張並排居中
<center class="third">
    <img src="http://xxx.jpg">
    <img src="http://yyy.jpg">
    <img src="http://zzz.jpg">
</center>

圖片添加連接

<figure class="half">
    <a href="http://jjx/images/xxx.jpg"><img src="http://jjx/images/ xxx.jpg"></a>
    <a href="http://jjx/images/yyy.jpg"><img src="http://jjx/images/ yyy.jpg"></a>
</figure>

視頻

添加視頻

<div align=center>
    <iframe height=498 width=510 src='http://player.youku.com/embed/XMzkzMTU5Mzg4NA==' frameborder=0 'allowfullscreen'>
    </iframe>
</div>

添加音頻

<div align=center><iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="https://music.163.com/outchain/player?type=2&id=27955653&auto=1&height=66"></iframe>
</div>

添加star按鈕

<iframe style="margin-left: 2px; margin-bottom:-5px;" frameborder="0" scrolling="0" width="100px" height="20px" src="https://ghbtns.com/github-btn.html?user=jaingmengmeng&repo=jaingmengmeng.github.io&type=star&count=true"></iframe>

參考連接

良有以也 - Markdown 簡明語法參考

lkkwxy - 如何在Markdown中畫流程圖