Markdown簡(jiǎn)介
Markdown是一種輕量級(jí)標(biāo)記語(yǔ)言,創(chuàng)始人為約翰·格魯伯(英語(yǔ):John Gruber)。 它允許人們使用易讀易寫的純文本格式編寫文檔,然后轉(zhuǎn)換成有效的XHTML(或者HTML)文檔。這種語(yǔ)言吸收了很多在電子郵件中已有的純文本標(biāo)記的特性。
由于Markdown的輕量化、易讀易寫特性,并且對(duì)于圖片,圖表、數(shù)學(xué)式都有支持,許多網(wǎng)站都廣泛使用Markdown來撰寫幫助文檔或是用于論壇上發(fā)表消息。 如GitHub、Reddit、Diaspora、Stack Exchange、OpenStreetMap 、SourceForge、簡(jiǎn)書等,甚至還能被使用來撰寫電子書。
對(duì)于程序員來講,使用Markdown做筆記比使用.txt和word要方便很多!
編輯器
本教程使用Typora講解Markdown的基本語(yǔ)法,這是一個(gè)跨平臺(tái)的編輯器,支持windows、MasOS和Linux操作系統(tǒng),導(dǎo)出支持HTML、PDF、Word、圖片等類型的文件。
可以在Typora官網(wǎng)上下載此編輯器 Typora官網(wǎng)
添加擴(kuò)展語(yǔ)法
在官網(wǎng)上下載安裝完Typora后,進(jìn)入設(shè)置添加擴(kuò)展語(yǔ)法,
方法如下:
隨后,我們就能使用Markdown的擴(kuò)展語(yǔ)法了。
Markdown教程
1. 標(biāo)題
使用“#”標(biāo)記
# 一級(jí)標(biāo)題
## 二級(jí)標(biāo)題
### 三級(jí)標(biāo)題
#### 四級(jí)標(biāo)題
##### 五級(jí)標(biāo)題
###### 六級(jí)標(biāo)題
效果如下:
一級(jí)標(biāo)題
二級(jí)標(biāo)題
三級(jí)標(biāo)題
四級(jí)標(biāo)題
五級(jí)標(biāo)題
六級(jí)標(biāo)題
2. 字體
可以使用如下字體:
*斜體文本*
_斜體文本_
**粗體文本**
__粗體文本__
***粗斜體文本***
___粗斜體文本___
效果如下:
斜體文本
斜體文本
粗體文本
粗體文本
粗斜體文本
粗斜體文本
3. 列表
無序表
使用*或+或-減號(hào)作為列表標(biāo)記
* one
* two
* three
+ 1
+ 2
+ 3
- 一
- 二
- 三
效果如下:
- ①
- ②
- ③
- 1
- 2
- 3
- 一
- 二
- 三
有序表
使用數(shù)字加 . 即可,如:
1. 1
2. 2
3. 3
效果如下:
- 1
- 2
- 3
列表嵌套
在子列表前面加四個(gè)空格或者兩個(gè)Tab即可
* a
1. b
2. c
3. d
* e
1. f
2. g
效果如下:
- a
- b
- c
- d
- e
- f
- g
4. 區(qū)塊
一個(gè)單獨(dú)的區(qū)塊
在開頭使用>即可,如:
> 區(qū)
> 塊
效果如下:
區(qū)
塊
區(qū)塊嵌套
區(qū)塊也可以像列表那樣可以嵌套一個(gè)>最外層,兩個(gè)>則是第二層,如:
> 區(qū)
> >塊
>>>嵌
>>>>套
區(qū)
塊
嵌
套
區(qū)塊與列表的混用
在區(qū)塊中是可以使用列表的,如:
> 姓名:
> 學(xué)號(hào):
> 成績(jī):
> * 數(shù)學(xué)
> * 語(yǔ)文
> * 英語(yǔ)
> 日期
效果如下:
姓名:
學(xué)號(hào):
成績(jī):
- 數(shù)學(xué)
- 語(yǔ)文
- 英語(yǔ)
日期
當(dāng)然,在列表中也能使用區(qū)塊:
* 姓名:
* 學(xué)號(hào):
* 成績(jī):
> * 數(shù)學(xué)
> * 語(yǔ)文
> * 英語(yǔ)
* 日期:
效果如下:
- 姓名:
- 學(xué)號(hào):
- 成績(jī):
- 數(shù)學(xué)
- 語(yǔ)文
- 英語(yǔ)
- 日期:
5. 代碼塊
可以在代碼開頭前用```加語(yǔ)言名的方式增加代碼塊,再用```標(biāo)記代碼的結(jié)束,如:
```C
int main(void)
{
return 0;
}```
效果如下:
int main(void)
{
return 0;
}
6. 鏈接
使用如下兩種方式添加鏈接:
[鏈接名稱](鏈接地址)
<鏈接地址>
使用簡(jiǎn)書舉例:
[簡(jiǎn)書](http://www.lxweimin.com/)
<http://www.lxweimin.com/>
效果如下:
簡(jiǎn)書
http://www.lxweimin.com/
7. 圖片
使用如下方式添加圖片:
題")
舉例:

效果如下:
Markdown 還沒有辦法指定圖片的高度與寬度,如果你需要的話,你可以使用普通的 <img> 標(biāo)簽。,如:
<img src="https://upload-images.jianshu.io/upload_images/26493533-f1acd5ec0ad5321f.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width="50%">
8. 表格
表格的制作
Markdown 制作表格使用 | 來分隔不同的單元格,使用 - 來分隔表頭和其他行。
舉例:
| 表頭 | 表頭 |
| ---- | ---- |
| 單元格 | 單元格 |
| 單元格 | 單元格 |
我們能得到:
表頭 | 表頭 |
---|---|
單元格 | 單元格 |
單元格 | 單元格 |
表格的對(duì)齊方式
我們可以設(shè)置表格的對(duì)齊方式:
-: 設(shè)置內(nèi)容和標(biāo)題欄居右對(duì)齊。
:- 設(shè)置內(nèi)容和標(biāo)題欄居左對(duì)齊。
:-: 設(shè)置內(nèi)容和標(biāo)題欄居中對(duì)齊。
實(shí)例如下:
| 左對(duì)齊 | 右對(duì)齊 | 居中對(duì)齊 |
| :-----| ----: | :----: |
| 單元格 | 單元格 | 單元格 |
| 單元格 | 單元格 | 單元格 |
左對(duì)齊 | 右對(duì)齊 | 居中對(duì)齊 |
---|---|---|
單元格 | 單元格 | 單元格 |
單元格 | 單元格 | 單元格 |
9.其他的一些語(yǔ)法
(部分語(yǔ)法屬于擴(kuò)展語(yǔ)法,簡(jiǎn)書可能會(huì)不支持,所以部分效果無法展示)
高亮
在需要重點(diǎn)標(biāo)注的詞句兩側(cè)加上==
我滴好兄弟,你可真==聰明==啊!
我滴好兄弟,你可真==聰明==??!
下標(biāo)
下標(biāo)的詞句兩側(cè)加上~
H~2~O
H2O
上標(biāo)
上標(biāo)的詞句兩側(cè)加上^
y = e^x+1^
y = ex+1
轉(zhuǎn)義
如果需要顯示特定的符號(hào)則需要使用轉(zhuǎn)義字符,Markdown 使用反斜杠轉(zhuǎn)義特殊字符:
**文本加粗**
\*\* 正常顯示星號(hào) \*\*
文本加粗
** 正常顯示星號(hào) **
公式
當(dāng)你需要在編輯器中插入數(shù)學(xué)公式時(shí),可以使用兩個(gè)美元符 $$ 包裹 TeX 或 LaTeX 格式的數(shù)學(xué)公式來實(shí)現(xiàn)。提交后,問答和文章頁(yè)會(huì)根據(jù)需要加載 Mathjax 對(duì)數(shù)學(xué)公式進(jìn)行渲染。如
$$
\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)}}
$$
結(jié)果為:
typora 畫流程圖、時(shí)序圖(順序圖)、甘特圖
復(fù)制以下代碼使用 typora 的源碼模式粘貼到編輯器中查看效果:
以下幾個(gè)實(shí)例效果圖如下:
1、橫向流程圖源碼格式:
graph LR
A[方形] -->B(圓角)
B --> C{條件a}
C -->|a=1| D[結(jié)果1]
C -->|a=2| E[結(jié)果2]
F[橫向流程圖]
2、豎向流程圖源碼格式:
graph TD
A[方形] --> B(圓角)
B --> C{條件a}
C --> |a=1| D[結(jié)果1]
C --> |a=2| E[結(jié)果2]
F[豎向流程圖]
3、標(biāo)準(zhǔn)流程圖源碼格式:
st=>start: 開始框
op=>operation: 處理框
cond=>condition: 判斷框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 輸入輸出框
e=>end: 結(jié)束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op
4、標(biāo)準(zhǔn)流程圖源碼格式(橫向):
st=>start: 開始框
op=>operation: 處理框
cond=>condition: 判斷框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 輸入輸出框
e=>end: 結(jié)束框
st(right)->op(right)->cond
cond(yes)->io(bottom)->e
cond(no)->sub1(right)->op
5、UML時(shí)序圖源碼樣例:
對(duì)象A->對(duì)象B: 對(duì)象B你好嗎?(請(qǐng)求)
Note right of 對(duì)象B: 對(duì)象B的描述
Note left of 對(duì)象A: 對(duì)象A的描述(提示)
對(duì)象B-->對(duì)象A: 我很好(響應(yīng))
對(duì)象A->對(duì)象B: 你真的好嗎?
6、UML時(shí)序圖源碼復(fù)雜樣例:
Title: 標(biāo)題:復(fù)雜使用
對(duì)象A->對(duì)象B: 對(duì)象B你好嗎?(請(qǐng)求)
Note right of 對(duì)象B: 對(duì)象B的描述
Note left of 對(duì)象A: 對(duì)象A的描述(提示)
對(duì)象B-->對(duì)象A: 我很好(響應(yīng))
對(duì)象B->小三: 你好嗎
小三-->>對(duì)象A: 對(duì)象B找我了
對(duì)象A->對(duì)象B: 你真的好嗎?
Note over 小三,對(duì)象B: 我們是朋友
participant C
Note right of C: 沒人陪我玩
7、UML標(biāo)準(zhǔn)時(shí)序圖樣例:
%% 時(shí)序圖例子,-> 直線,-->虛線,->>實(shí)線箭頭
sequenceDiagram
participant 張三
participant 李四
張三->王五: 王五你好嗎?
loop 健康檢查
王五->王五: 與疾病戰(zhàn)斗
end
Note right of 王五: 合理 食物 <br/>看醫(yī)生...
李四-->>張三: 很好!
王五->李四: 你怎么樣?
李四-->王五: 很好!
8、甘特圖樣例:
%% 語(yǔ)法示例
gantt
dateFormat YYYY-MM-DD
title 軟件開發(fā)甘特圖
section 設(shè)計(jì)
需求 :done, des1, 2014-01-06,2014-01-08
原型 :active, des2, 2014-01-09, 3d
UI設(shè)計(jì) : des3, after des2, 5d
未來任務(wù) : des4, after des3, 5d
section 開發(fā)
學(xué)習(xí)準(zhǔn)備理解需求 :crit, done, 2014-01-06,24h
設(shè)計(jì)框架 :crit, done, after des2, 2d
開發(fā) :crit, active, 3d
未來任務(wù) :crit, 5d
耍 :2d
section 測(cè)試
功能測(cè)試 :active, a1, after des3, 3d
壓力測(cè)試 :after a1 , 20h
測(cè)試報(bào)告 : 48h
參考資料
- 參考網(wǎng)站:
- 封面與圖片的示例圖片均來自Pixiv,圖片id已標(biāo)注。