Markdown超詳細使用說明

原文地址：點擊查看

內容摘要

介紹了Markdown的來源，使用場景，並以豐富的示例，詳細介紹了Markdown的各種語法，幫助大家更好的使用Markdown。
如果您覺得有用，也歡迎將本文推薦給您的朋友。

什麼是Markdown

Markdown是一種輕量級標記語言，通過純文本的方式編寫文檔，然後再通過工具轉化成HTML，PDF，圖片等格式，實現Write Once，Read Everywhere的效果。
更詳細的定義參見維基百科

Markdown示意圖：

使用Markdown的好處是什麼呢

Markdown是一種純文本標記語言，那麼純文本標記語言有什麼好處呢？

1. 方便編輯。任何一個文本編輯器就可以編輯，連大家熟悉的Windows記事本也可以。讓編寫者專注於內容，而不是格式。是否有爲了調整不聽話的編輯器（好吧，我說的就是word）的格式而浪費大量時間的經歷？
2. 可以放到版本管理系統中，追蹤歷史變更。這對碼農們來說太重要了，這樣文檔可以和程序代碼一起放版本管理系統中了。如果你不清楚版本管理系統，只需要把它理解成可以永久追蹤的修改歷史記錄即可（版本管理系統可以另開一篇文章了）。這樣，多人協作編輯的時候，也不用擔心文檔被改壞了。

要把時間放在製造優質內容上，而不是調整文檔格式。（想起了多年前做研究生論文的時候。。。）

Markdown的歷史

Markdown由John Gruber在2004年創建。其中在語法上有很大一部分是跟Aaron Swartz共同合作的。

Aaron Swartz就是那位於2013年自殺，有着開掛一般人生經歷的程序員。維基百科對他的介紹是：軟件工程師、作家、政治組織者、互聯網活動家、維基百科人。

他有着足以讓你跪拜的人生經歷：

• 14歲參與RSS 1.0規格標準的制訂。
• 2004年入讀斯坦福，之後退學。
• 2005年創建Infogami，之後與Reddit合併成爲其合夥人。
• 2010年創立求進會（Demand Progress），積極參與禁止網絡盜版法案（SOPA）活動，最終該提案居然被撤回。
• 2011年7月19日，因被控從MIT和JSTOR下載480萬篇學術論文並以免費形式上傳於網絡被捕。
• 2013年1月自殺身亡。

天才都有早逝的歸途（又是一位猶太人）。

Markdown的用途

• 論壇或博客
• gitbook
• 郵件
• 學術論文
• 等等

Markdown能用在哪些地方

• GitHub
• 簡書
• Stack Overflow
• Apollo
• Moodle
• Reddit
• 等等

Markdown語法詳解

標題：使用 # 標記標題

使用 # 號可標記1 - 6級標題，一級標題對應 1 個 # 號，二級標題對應 2 個 # 號，以此類推。

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

顯示效果如下：

一級標題

二級標題

三級標題

四級標題

五級標題

六級標題

段落格式及字體

段內換行和段落之間

段落內的換行使用 2 個以上空格加上回車；也可以在段落後面使用一個空行來表示重新開始一個段落。

這是第一段的第1行    <--末尾添加至少2個空格
這是第一段的第2行
(空行)
這是第二段
(空行)
這是第三段

顯示效果如下：
這是第一段的第1行
這是第一段的第2行

這是第二段

這是第三段

字體

*斜體文本*   
_斜體文本_  
**粗體文本**  
__粗體文本__   
***粗斜體文本***  
___粗斜體文本___  

顯示效果如下：

斜體文本
斜體文本
粗體文本
粗體文本
粗斜體文本
粗斜體文本

字號及顏色

<font size=1>大小爲1的字體</font>
<font size=6>大小爲6的字體</font>

<font color=gray size=4>gray顏色的字</font>
<font color=green size=4>green顏色的字</font>
<font color=hotpink size=4>hotpink顏色的字</font>
<font color=LightCoral size=4>LightCoral顏色的字</font>
<font color=LightSlateGray size=4>LightSlateGray顏色的字</font>
<font color=orangered size=4>orangered顏色的字</font>
<font color=red size=4>red顏色的字</font>
<font color=springgreen size=4>springgreen顏色的字</font>
<font color=Turquoise size=4>Turquoise顏色的字</font>

顯示效果如下：(如這裏看不到效果，說明此網站Markdown實現不支持插入HTML標籤)

大小爲1的字體
大小爲6的字體
gray顏色的字
green顏色的字
hotpink顏色的字
LightCoral顏色的字
LightSlateGray顏色的字
orangered顏色的字
red顏色的字
springgreen顏色的字
Turquoise顏色的字

分隔線

有多種方法都可以建立分隔線：3個以上的星號，3個以上的減號，3個以上的下劃線，也可以在星號、減號、下劃線中間插入空格，這幾種方式都可以建立分隔線。

***
* * *
******
- - -
_ _ _

顯示效果如下：

---

---

---

---

---

刪除線

我沒有刪除線
我也沒有刪除線
~~我有刪除線~~

顯示效果如下：

我沒有刪除線
我也沒有刪除線
我有刪除線

下劃線

Markdown中並無下劃線的原生語法，可以通過HTML的<u>標籤來實現。

<u>我帶下劃線</u>

顯示效果如下：

我帶下劃線

腳註

腳註是對文本的補充說明。

[^要註明的文本]

示例：

創建腳註格式類似這樣 [^Markdown]。
[^Markdown]: 這是一個腳註

顯示效果如下：

創建腳註格式類似這樣¹

Markdown列表

無序列表

無序列表使用星號，加號或是減號作爲標記。

* 列表項1
* 列表項2

+ 列表項1
+ 列表項2

- 列表項1
- 列表項2

顯示效果如下：

• 列表項1
• 列表項2

• 列表項1
• 列表項2

• 列表項1
• 列表項2

有序列表

有序列表使用數字加上 . 號來表示，注意 . 號和實際內容之間需要加一個空格。

1. 有序列表項1
2. 有序列表項2

顯示效果如下：

1. 有序列表項1
2. 有序列表項2

列表嵌套

列表嵌套只需要在子列表選項的前面添加 4 個空格即可。

* 無序列表1
    1. 有序列表1.1
    2. 有序列表1.2
* 無序列表2
    - 無序列表2.1
    - 無序列表2.2

• 無序列表1
  1. 有序列表1.1
  2. 有序列表1.2
• 無序列表2
  • 無序列表2.1
  • 無序列表2.2

Markdown區塊

區塊使用 > 符號，後面加上一個空格。

> 區塊
> Markdown
> 用Markdown寫文章，爽！

顯示效果如下：

區塊
Markdown
用Markdown寫文章，爽！

區塊嵌套：每一層嵌套加上 > 符號和空格

> 區塊
> > 嵌套1
> > > 嵌套2

顯示效果如下：

區塊

嵌套1

嵌套2

Markdown代碼

行內函數或代碼片段，直接使用反引號即可。注意這裏的反引號是鍵盤左上角的那個鍵，一般在esc鍵下面。

`print("hello, world")`函數

顯示效果如下：

print("hello, world")函數

代碼區塊1

代碼區塊使用 4 個空格或 1 個製表符(Tab)

    <?php
      function test() {
        echo 'hello, world';
      }
      test()
    ?>          

顯示效果如下：

<?php
    function test() {
        echo 'hello, world';
    }
    test()
?>

代碼區塊2

也可以使用```包裹一段代碼，並指定一種語言（也可以不指定）。

​```java
public class HelloWorld {
	public static void main(String[] args) {
		System.out.println("hello, world");
	}
}
​```

顯示效果如下：

public class HelloWorld {
	public static void main(String[] args) {
		System.out.println("hello, world");
	}
}

鏈接

鏈接的使用方法：

[鏈接名稱][鏈接地址]

或者

<鏈接地址>

例如：

[SanFeng的網絡日誌](http://blog.kfzhang.cn)
或
<http://blog.kfzhang.cn>

顯示效果如下：

SanFeng的網絡日誌

或者直接使用鏈接地址：

http://blog.kfzhang.cn

高級用法

鏈接也可以用變量來替代，文檔末尾附帶變量地址（下面的blog和home都是變量）：

[訪問博客請點擊][blog]
[訪問首頁請點擊][home]
[blog]: http://blog.kfzhang.cn
[home]: http://www.kfzhang.cn

顯示效果如下：
訪問博客請點擊
訪問首頁請點擊

圖片

Markdown圖片語法格式如下：

開頭一個感嘆號!
接着一個方括號，裏面放上圖片的替代文字
接着一個普通括號裏面放上圖片的地址，最後還可以用引號包住並加上選擇性的'title'屬性的文字

![alt 屬性文本](圖片地址)
![alt 屬性文本](圖片地址 "可選標題")

例：

![logo](http://www.kfzhang.cn/images/logo-180X180.png)
![logo](http://www.kfzhang.cn/images/logo-180X180.png logo)

高級用法

跟鏈接的用法類似，也可以像網址那樣對圖片地址使用變量。

鏈接也可以用變量來替代，文檔末尾附帶變量地址：

![logo][1]
[1]: http://www.kfzhang.cn/images/logo-180X180.png

擴展用法

原生Markdown不支持調整圖片的高度、寬度等參數，可以使用<img>標籤，當然並不是所有的Markdown實現都支持這種用法，實測爲準。

<img src="http://www.kfzhang.cn/images/logo-180X180.png" width=10%>

顯示效果如下：(如這裏看不到效果，說明此網站Markdown實現不支持插入HTML標籤)

表格

Markdown表格使用 | 來分隔單元格，使用 - 來分隔表頭和其它行。

| 表頭 | 表頭 |
| --- | --- |
| 單元格 | 單元格 |
| 單元格 | 單元格 |

顯示效果如下：

表頭	表頭
單元格	單元格
單元格	單元格

對齊方式

可以設置表格的對齊方式：

-: 設置內容和標題欄右對齊
:- 設置內容和標題欄左對齊
:-: 設置內容和標題欄居中對齊

示例：

| 左對齊 | 右對齊 | 居中對齊 |
| :---- | ----: | :----: |
| 單元格 | 單元格 | 單元格 |
| 單元格 | 單元格 | 單元格 |

顯示效果如下：

左對齊	右對齊	居中對齊
單元格	單元格	單元格
單元格	單元格	單元格

高級技巧 - HTML元素

支持HTML元素

不在 Markdown 涵蓋範圍之內的標籤，都可以直接在文檔裏面用 HTML 撰寫。
目前支持的 HTML 元素有：<kbd> <b> <i> <em> <sup> <sub> <br>等。
示例：

使用 <kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Del</kbd> 來重啓電腦   
<b>加粗的字體</b>   
<i>斜體字</i>
<em>強調文本</em>
這個文本包含<sup>上標</sup>文本
這個文本包含<sub>下標</sub>文本
使用 br 元素<br>在文本中<br>換行

顯示效果如下：(如這裏看不到效果，說明此網站Markdown實現不支持插入HTML標籤)
使用 Ctrl + Alt + Del 來重啓電腦
加粗的字體
斜體字
強調文本
這個文本包含^上標文本
這個文本包含_下標文本
使用 br 元素
在文本中
換行

高級技巧 - 轉義

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}
$$

顯示效果如下：
$\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}$
更詳細的數學公式請參考Markdown中Latex數學公式基本語法

常見的Markdown軟件

本文主要關注Markdown的使用，對常見的Markdown工具及軟件就不詳細描述了，如有興趣請參見：簡單易懂Markdown工具篇

就個人的喜好和使用經驗來講，強烈推薦Typora，支持多平臺包括Win，Mac，Linux，真的非常好用。

---

參考文獻：

標題	地址
Markdown教程	https://www.runoob.com/markdown/md-tutorial.html
讓文檔迴歸本質，爲什麼應該用Markdown	http://jolestar.com/markdown-tools/
Markdown語法全解	https://blog.csdn.net/jk_chen_acmer/article/details/81589871
Markdown中Latex數學公式基本語法	https://blog.csdn.net/u014630987/article/details/70156489

---

1. 這是一個腳註 ↩︎