# MarkDown
MarkDown是一種標記語言，只提供必要的功能，理念上不希望使用太花巧的 CSS 寫文檔。
MarkDown可以被轉譯為HTML。也可轉譯成pdf等文檔。
# __標題__
以\# (有一個空格)開頭的文字將成為標題，如上面 MarkDown筆記 標題般顯示。
\#可以疊加多個以得到小標題，最多六個如下：
`# MarkDown筆記` 這是產生本文標題的代碼。
## 兩個\# 的小標題，等于HTML 的 H2
### 三個\# 的小標題，等于HTML 的 H3
#### 四個\# 的小標題，等于HTML 的 H4
##### 五個\# 的小標題，等于HTML 的 H5
###### 六個\# 的小標題，等于HTML 的 H6
還有一種寫法可以得到 H1 和 H2 的效果，為避免造成混亂便不提及，有興趣可以參考[中文文件](http://xianbai.me/learn-md)。
___
# __內容__
## 字體
連續兩個空格加上回車可以換行
`*斜體* or _斜體_` = _斜體_
`**加粗** or __加粗__` = __加粗__
`**_斜體加粗體_**` = **_斜體加粗_**
`~~刪除~~` = ~~刪除~~
## __列表__
```
* 第一列
* 第二列
- 巢狀
* 第二層
+ 第三層
1. 有序列表
2. 第二列
1. 巢狀
2. 第二列
3. 第三列
* 無序
4. 第四列
```
* 第一列
* 第二列
- 巢狀
* 第二層
+ 第三層
1. 有序列表
2. 第二列
1. 巢狀
2. 第二列
3. 第三列
* 無序
4. 第四列
## 引用
> 引用文字的效果
> 使用 `> `後加上內容
> 
> 也可以加入圖片
## 跳脫字元
MarkDown 使用 \\ 作為跳脫字元，當想輸出\# 時在\# 前加上一個 \\ 就可以輸出\#。
跳脫字元可以幫助輸出以下字元：
```
\ 反斜線
` 反引號
* 星號
_ 底線
{} 大括號
[] 方括號
() 括號
# 井字號
+ 加號
- 減號
. 英文句點
! 驚嘆號
```
## 連結
`<http://example.com/>` = <http://google.com/>
`<address@example.com>` = <address@example.com>
`[顯示文字](url "提示")` = [顯示文字](url "提示")
註意是 url 不是 "url"，提示是滑鼠移到目標上滑鼠旁出現的小文字，可以不加提示。
## 跳轉
可以使用連結達到[目錄](#目錄)的跳轉效果。`[顯示文字](#目標)`目標只能是以 \# 開頭的標題。
## 表格
| 這一列居左 | 這一列居中 | 這一列居右 |
| :----- | :-------: | -----: |
| Hello | Mark | Down |
|表格|默認|居左|
以下是產生上面表格的程式碼
```
| 這一列居左 | 這一列居中 | 這一列居右 |
| :-------- | :---------: | -------: |
| Hello | Mark | Down |
| 表格 |默認 |居左 |
```
## 分格線
第一行是表頭，第二行調整居左居中居右，:--- 是居左、:---:是居中、 ---: 是居右。
下面的分格線是使用 `___` 三個底線產生的。
___
# __程式碼__
使用 \` \` 可以包著單句的程式碼。
\`printf()\` = `printf()`
多行程式碼
\`\`\` (語言類型)
(程式碼內容)
\`\`\`
``` c
#include <stdio.h>
int main(){
return 0;
}
```
MarkDown 會以第一行\`\`\` 後指定的語言進行高亮顯行。主流程式語言都支援。
___
# __圖片__
```
```
替代文字是找不到圖片時顯示的文字，url 是圖片的網址或本地位址，註意url不是"url"，顯示文字是滑鼠移到圖片上時滑鼠旁出現的文字。
___
# __內嵌HTML__
MarkDown可以內嵌HTML，因為 MarkDown 最後會被翻譯成 HTML 所以理論上可以使用所有HTML的語法。使用時直接`<div></div>`就可以。
___
# mermaid
maermail是markdown的畫圖工具。可以直接產生流程圖等圖示。
\`\`\`mermaid
代碼
\`\`\`
便可生成mermaid代碼所描述的圖。
## 方向
### 上到下
```
graph TD
Start --> Stop
```
```mermaid
graph TD
Start --> Stop
```
### 下到上
```
graph BT
Start --> Stop
```
```mermaid
graph BT
Start --> Stop
```
### 左到右
```
graph LR
Start --> Stop
```
```mermaid
graph LR
Start --> Stop
```
### 下到上
```
graph RL
Start --> Stop
```
```mermaid
graph RL
Start --> Stop
```
## 節點
```
graph LR
A[正方形]
B{text}
C(圓邊)
D((圓形))
E>旗形]
F[/梯形\]
H[\梯形/]
```
```mermaid
graph LR
A[正方形]
B{text}
C(圓邊)
D((圓形))
E>旗形]
F[/梯形\]
H[\梯形/]
```
## 箭頭
```
graph LR
A-->B
C---D
E-- This is the text ---F
H---|This is the text|I
J-->|text|K
L-- text -->N
M-.->O;
P-. text .-> Q
R ==> S
T == text ==> U
```
```mermaid
graph LR
A-->B
C---D
E-- This is the text ---F
H---|This is the text|I
J-->|text|K
L-- text -->N
M-.->O;
P-. text .-> Q
R ==> S
T == text ==> U
```
## 子圖
```
graph TB
c1-->a2
subgraph one
a1-->a2
end
subgraph two
b1-->b2
end
subgraph three
c1-->c2
end
```
```mermaid
graph TB
c1-->a2
subgraph one
a1-->a2
end
subgraph two
b1-->b2
end
subgraph three
c1-->c2
end
```
```mermaid
graph TB
c1-->a2
subgraph one
a1-->a2
subgraph free
q --> a1
end
end
subgraph two
b1-->b2
end
subgraph three
c1-->c2
end
```
## 順序圖
```
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
```
```mermaid
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
```
### 宣告
```
sequenceDiagram
participant John
participant Alice
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
```
```mermaid
sequenceDiagram
participant John
participant Alice
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
```
### 取名
```
sequenceDiagram
participant A as Alice
participant J as John
A->>J: Hello John, how are you?
J->>A: Great!
```
```mermaid
sequenceDiagram
participant A as Alice
participant J as John
A->>J: Hello John, how are you?
J->>A: Great!
```
### 持續
`activate`會開啓一個方块直到`deactivate`。另一個寫法是在接受方前加`+`作為開始結速時加`-`。
```
sequenceDiagram
Alice->>John: Hello John, how are you?
activate John
John-->>Alice: Great!
deactivate John
John->>+Alice: 10 + 20?
Alice-->>John: processing
Alice->>-John: 30
```
```mermaid
sequenceDiagram
Alice->>John: Hello John, how are you?
activate John
John-->>Alice: Great!
deactivate John
John->>+Alice: 10 + 20?
Alice-->>John: processing
Alice->>-John: 30
```
```mermaid
sequenceDiagram
Alice->>+John: Hello John, how are you?
John-->>Alice: Great!
John-->>-Alice: Great!
```
```
sequenceDiagram
Alice->>+John: Hello John, how are you?
Alice->>+John: John, can you hear me?
John-->>-Alice: Hi Alice, I can hear you!
John-->>-Alice: I feel great!
```
```mermaid
sequenceDiagram
Alice->>+John: Hello John, how are you?
Alice->>+John: John, can you hear me?
John-->>-Alice: Hi Alice, I can hear you!
John-->>-Alice: I feel great!
```
```
sequenceDiagram
participant John
Note right of John: Text in note
```
### 块
```
sequenceDiagram
participant A as John
participant B as Alice
participant C as Joe
Note left of A: Text in note
Note right of B: Text in note
Note over A,B:a Note over two
Note over B,C:a Note over two
loop Every minute
A-->C: Great
end
alt is sick
A->>B: Not so good :(
else is well
B->>C: Feeling fresh like a daisy
opt Extra response
B->>A: Thanks for asking
end
end
```
## Class
```mermaid
classDiagram
class Test
Test <-- Car
class Animal
```
# graphviz
``` graphviz
graph {
a -- b;
b -- c;
a -- c;
d -- c;
e -- c;
e -- a;
}
digraph graph_name{
bgcolor="transparent";//背景透明
subgraph cluster_subgraph_name{//聚集子图
node[shape=box];
cluster_A -> cluster_B;
}
subgraph subgraph_name{//子图
node[shape=none];
sub_A -> sub_B;
}
{//匿名子图
node[shape=octagon];
nest_A -> nest_B;
}
global_A -> global_B;
cluster_B -> global_B;
sub_B -> global_B;
nest_B -> global_B;
}
```
Sign in with Wallet
Connect another wallet