歡迎關(guān)注微信公眾號(hào):北島向南(id:nanzhouie)

GitHub Pages:https://zhouie.cn/markdown-doc/
1. 認(rèn)識(shí) Markdown
HTML (
HyperText Markup Language) 作為一種超文本標(biāo)記語(yǔ)言 (Markup Language) 應(yīng)運(yùn)而生,無(wú)數(shù)的網(wǎng)頁(yè)從此有了主次分明,層次清晰的格式。
如果將 HTML 比作一架重機(jī)槍,那么 Markdown 就是一把手槍,滿足了主要的文本格式標(biāo)記的需求,可是操作性卻大大簡(jiǎn)化。
秉承 易讀易寫(xiě) 的宗旨,Markdown 作為一種輕量級(jí)標(biāo)記語(yǔ)言 (Lightweight Markup Language) ,讓無(wú)數(shù)的程序猿和文字工作者愛(ài)不釋手。
1.1 Markdown的優(yōu)點(diǎn)
- 專注你的文字內(nèi)容而不是排版樣式,安心寫(xiě)作
- 輕松的導(dǎo)出
HTML、PDF和本身的.md文件 - 純文本內(nèi)容,兼容所有的文本編輯器與字處理軟件
- 隨時(shí)修改你的文章版本,不必像字處理軟件生成若干文件版本導(dǎo)致混亂
- 可讀、直觀、學(xué)習(xí)成本低
1.2 Markdown 的現(xiàn)狀
有時(shí)候一件事情的真相,不是來(lái)自于對(duì)它的思考,而是來(lái)自于對(duì)它的感覺(jué)。
——Stanley Kubrick
這是 John Grumber 最喜歡的用來(lái)解釋 Markdown 設(shè)計(jì)初衷的一句話,Markdown 語(yǔ)言希望帶來(lái)的就是純粹的寫(xiě)作的感覺(jué),旨在簡(jiǎn)潔、高效,也由于 Markdown 的易讀易寫(xiě),人們用不同的編程語(yǔ)言實(shí)現(xiàn)了多個(gè)版本的解析器和生成器。
目前不同的 Markdown 工具集成了不同的功能(但基礎(chǔ)功能大致相同),例如 流程圖 與 時(shí)序圖 ,復(fù)雜表格 與 復(fù)雜公式 的呈現(xiàn)。
我相信隨著 Markdown 語(yǔ)法的逐漸普及開(kāi)來(lái),以后更多的平臺(tái)會(huì)支持 Markdown 書(shū)寫(xiě)模式,并集成更加完整的功能模塊。
雖然功能的 “豐富” 并沒(méi)有什么本質(zhì)的缺點(diǎn),但這個(gè)程度一旦 “過(guò)” 了頭,終歸有些背離初衷,與 “易讀易寫(xiě)” 出現(xiàn)矛盾,開(kāi)始在編寫(xiě)的過(guò)程中覺(jué)得有些許吃力了。那這個(gè)時(shí)候,用戶可能會(huì)覺(jué)得,不如使用專業(yè)化的工具來(lái)撰寫(xiě)更有效率。
1.3 Markdown官方文檔
了解一下 John Gruber
2004 年 John Gruber創(chuàng)造 Markdown 語(yǔ)言,14年間,Markdown 語(yǔ)言從程序員圈子中逐漸擴(kuò)散開(kāi)來(lái),成為了越來(lái)越多的電腦寫(xiě)作者第一選擇。
John Gruber 是一個(gè)資深果粉,他的個(gè)人博客 Daring Fireball 被人戲稱為 蘋(píng)果官方喉舌博客。所以你應(yīng)該懂為什么最好的 Markdown 編輯器都集中在 Mac 平臺(tái)上了吧。
2. 使用Markdown
2.1 標(biāo)題
Markdown 通過(guò)在行首添加 1 ~ 6個(gè) # 符號(hào)來(lái)定義不同級(jí)別的標(biāo)題,最多到六級(jí)標(biāo)題。
注意 :# 后最好是需要加一個(gè)空格。
- 書(shū)寫(xiě)格式
# 一級(jí)標(biāo)題
## 二級(jí)標(biāo)題
### 三級(jí)標(biāo)題
###### 六級(jí)標(biāo)題
- 解析效果

特別的,還可使用 = (高階標(biāo)題) 和 - (次階標(biāo)題) 標(biāo)記 一級(jí) 和 二級(jí) 標(biāo)題。
注意:= 和 - 的個(gè)數(shù)在不同 Markdown 工具中都有不同,但這倒不是多大的問(wèn)題了,簡(jiǎn)單試試就知道了。
- 書(shū)寫(xiě)格式
效果和一級(jí)標(biāo)題一樣
=
效果和二級(jí)標(biāo)題一樣
-
- 解析效果

2.2 加粗、斜體 和 刪除線
markdown使用
*和_強(qiáng)調(diào)文本,使用一個(gè)*和_包圍的文本會(huì)被轉(zhuǎn)化為 斜體 ;而用兩個(gè)*和_包圍的文本則會(huì)被轉(zhuǎn)化成 加粗 ;使用兩個(gè)~包圍的文本會(huì)被轉(zhuǎn)化為刪除線但如果你的
*、_和~兩邊都有空白的話,它們就只會(huì)被當(dāng)成普通的符號(hào),這其實(shí)也是一個(gè)需要注意的地方如果要在文字前后直接插入普通的 星號(hào)
*或 下劃線_,你可以用 反斜杠\轉(zhuǎn)義書(shū)寫(xiě)格式
*斜體文字*
_斜體文字_
**加粗文字**
__加粗文字__
~~刪除內(nèi)容~~
- 解析效果
斜體文字
斜體文字
加粗文字
加粗文字
刪除內(nèi)容
2.3 列表
Markdown支持 無(wú)序列表 和 有序列表。
無(wú)序列表可以使用 * , + , - 三者中任意符號(hào)來(lái)標(biāo)記;有序列表則使用 數(shù)字 加 . 來(lái)標(biāo)記。
注意:標(biāo)記后面最好是需要加一個(gè)空格,有序列表的數(shù)字會(huì)被按順序自動(dòng)更正。通常情況下,無(wú)序列表的項(xiàng)目符號(hào)是按照實(shí)心圓、空心圓、實(shí)心方格的層級(jí)關(guān)系遞進(jìn)的。
- 書(shū)寫(xiě)格式
有序列表
1. 第一點(diǎn)
2. 第二點(diǎn)
5. 第三點(diǎn)
無(wú)序列表
* 這是無(wú)序列表項(xiàng)目
- 這是無(wú)序列表項(xiàng)目
+ 這是無(wú)序列表項(xiàng)目
嵌套的列表
- 呵呵
+ 嘉嘉
* 嘻嘻
* 吼吼
* 嘎嘎
- 桀桀
+ 哈哈
- 解析效果
有序列表
- 第一點(diǎn)
- 第二點(diǎn)
- 第三點(diǎn)
無(wú)序列表
- 這是無(wú)序列表項(xiàng)目
- 這是無(wú)序列表項(xiàng)目
- 這是無(wú)序列表項(xiàng)目
嵌套的列表
- 呵呵
- 嘉嘉
- 嘻嘻
- 吼吼
- 嘎嘎
- 桀桀
- 哈哈
2.4 引用
在段落前添加一個(gè) > 符號(hào)即可將該段落標(biāo)記為引用
注意: > 后最好是需要加一個(gè)空格;>、>> 和 >>> 等多層嵌套的使用,有點(diǎn)不太好總結(jié),不要問(wèn)我為什么,實(shí)踐出真知。
- 書(shū)寫(xiě)格式
一般用法
> 這是引用
迭代使用(引用中的引用)
> 這是一級(jí)引用
>> 這是二級(jí)引用
>>> 這是三級(jí)引用
>>
>> 這是二級(jí)引用
>
> 這是一級(jí)引用
引用的區(qū)塊內(nèi)也可使用其他 Markdown 語(yǔ)法
> 1. 這是第一行列表項(xiàng)。
> 3. 這是第二行列表項(xiàng)。
> 5. 這是第三行列表項(xiàng)。
>
> 給出一些例子代碼:
>
> return shell_exec("echo $input | $markdown_script");
- 解析效果
一般用法
這是引用
迭代使用(引用中的引用)
這是一級(jí)引用
這是二級(jí)引用
這是三級(jí)引用
這是二級(jí)引用
這是一級(jí)引用
引用的區(qū)塊內(nèi)也可使用其他 Markdown 語(yǔ)法
- 這是第一行列表項(xiàng)。
- 這是第二行列表項(xiàng)。
- 這是第三行列表項(xiàng)。
給出一些例子代碼:
return shell_exec("echo $input | $markdown_script");
- 補(bǔ)充一下
引用區(qū)塊>和代碼區(qū)塊```的區(qū)別:
>引用區(qū)塊中的文本保留Markdown語(yǔ)法,而```代碼塊中的文本不保留Markdown語(yǔ)法。
2.5 分割線
分割線最常使用就是三個(gè)或以上 * ,還可以使用 - 和 _ 。
注意:使用 --- 作為水平分割線時(shí),要在它的前面空一行,防止 --- 被當(dāng)成標(biāo)題標(biāo)記的表示方式。
- 書(shū)寫(xiě)格式
---
***
___
- 解析效果
2.6 插入鏈接
markdown文本中插入鏈接非常方便,有 文內(nèi)鏈接 和 引用鏈接 兩種方式。
注意:文內(nèi)鏈接 和 引用鏈接 顯示效果是一樣的,但是在編輯狀態(tài)下的使用情況不一樣。文內(nèi)鏈接緊跟鏈接文字,可以在看到鏈接文字的同時(shí)清楚的知道鏈接地址,但是不便于多次重復(fù)利用。
引用鏈接可以重復(fù)使用,但一般都是將一些鏈接放在一起統(tǒng)一管理,如一段文字后面或文章結(jié)尾,因此在找到鏈接和鏈接文字的對(duì)應(yīng)關(guān)系上有些麻煩,各有利弊,分情況使用吧。
- 書(shū)寫(xiě)格式
文內(nèi)鏈接
這是一個(gè)文內(nèi)鏈接的[例子](http://example.com/ "鼠標(biāo)懸浮此處顯示的標(biāo)題")。
[這個(gè)](http://example.net/)鏈接在鼠標(biāo)懸浮時(shí)沒(méi)有標(biāo)題。
[這個(gè)](/about/)鏈接是本地資源。
引用鏈接
這是一個(gè)引用鏈接的 [例子][id],[例子2][]。
[id]: http://example.com/ "鼠標(biāo)懸浮標(biāo)題(可選)"
[例子2]: http://example.com/
注意,這里的 id 沒(méi)有大小寫(xiě)區(qū)分,如果省略 id ,則前面方括號(hào)的內(nèi)容會(huì)被用作 id 。
我常用的網(wǎng)站包括 [Google][1], [Yahoo][2] 和 [MSN][3] 。
[1]: http://google.com/ "Google"
[2]: http://search.yahoo.com/ "Yahoo Search"
[3]: http://search.msn.com/ "MSN Search"
也可以寫(xiě)成
我常用的網(wǎng)站包括 [Google][],[Yahoo][] 和 [MSN][] 。
[google]: http://google.com/ "Google"
[yahoo]: http://search.yahoo.com/ "Yahoo Search"
[msn]: http://search.msn.com/ "MSN Search"
- 解析效果
文內(nèi)鏈接
這是一個(gè)文內(nèi)鏈接的
這是一個(gè)鏈接的例子。
這個(gè)鏈接在鼠標(biāo)懸浮時(shí)沒(méi)有標(biāo)題。
這個(gè)鏈接是本地資源。

2.7 插入圖片
插入圖片和插入鏈接非常類似,只是在方括號(hào)前多一個(gè) ! 。
[圖片上傳失敗...(image-3c0559-1533526878147)]
- Alt text為如果圖片無(wú)法顯示時(shí)顯示的文字。
- /path/to/img.jpg為圖片所在路徑。
- Optional title為顯示標(biāo)題。顯示效果為在你將鼠標(biāo)放到圖片上后,會(huì)顯示一個(gè)小框提示,提示的內(nèi)容就是Optional title。
注意:Markdown 語(yǔ)法目前還沒(méi)有某種合適的辦法指定圖片的寬高,但據(jù)我所知,很多平臺(tái)以及在這個(gè)方向作出相當(dāng)多的改進(jìn)了,一起期待吧!
- 書(shū)寫(xiě)格式
文內(nèi)鏈接

引用鏈接
![idol][idol]
[idol]: http://pcx2lec2u.bkt.clouddn.com/201808051449_378.jpg
- 解析效果
文內(nèi)鏈接


2.8 表格
表格的書(shū)寫(xiě)格式一目了然,還是很方便簡(jiǎn)潔的。
- 書(shū)寫(xiě)格式
| 左對(duì)齊 | 中間對(duì)齊 | 右對(duì)齊 |
| :--- | :---: | ---: |
| 左1 | 中1 | 右1 |
| 左2 | 中2 | 右3 |
- 解析效果
| 左對(duì)齊 | 中間對(duì)齊 | 右對(duì)齊 |
|---|---|---|
| 左1 | 中1 | 右1 |
| 左2 | 中2 | 右2 |
2.9 角標(biāo)
不同于前面說(shuō)的鏈接,這里的角標(biāo)內(nèi)容會(huì)被放在文末,點(diǎn)擊可以實(shí)現(xiàn)跳轉(zhuǎn),使用 [^] 來(lái)定義腳注。
- 書(shū)寫(xiě)格式
使用 Markdown[^1] 可以效率的書(shū)寫(xiě)文檔,直接轉(zhuǎn)換成 HTML[^2] ,你可以使用Leanote[^Le] 編輯器進(jìn)行書(shū)寫(xiě)。
[^1]: Markdown是一種純文本標(biāo)記語(yǔ)言
[^2]: HyperText Markup Language 超文本標(biāo)記語(yǔ)言
[^Le]: 開(kāi)源筆記平臺(tái),支持Markdown和筆記直接發(fā)為博文
- 解析效果
使用 Markdown[1] 可以效率的書(shū)寫(xiě)文檔,直接轉(zhuǎn)換成 HTML[2] ,你可以使用Leanote[3] 編輯器進(jìn)行書(shū)寫(xiě)。
2.10 上下標(biāo)
<sub>、<sup> 用作表示上下標(biāo)
- 書(shū)寫(xiě)格式
E = mc<sup>2</sup>
Water : H<sub>2</sub>O
- 解析效果
E = mc2
Water : H2O
2.11 直接鏈接與郵箱
在 markdown 中將 鏈接地址 或 郵箱地址 用 <> 包圍,則會(huì)被自動(dòng)轉(zhuǎn)換成可點(diǎn)擊的鏈接地址。
- 書(shū)寫(xiě)格式
<http://haoeric.com>
<haoeric0520@gmail.com>
- 解析效果
2.12 換行
使用html標(biāo)簽 <br/> 、 <br> 換行
- 書(shū)寫(xiě)格式
第一行hahaha <br/> 第二行6666
- 解析效果
第一行hahaha
第二行6666
2.13 反斜杠
如果需要避免文本中的符號(hào)被當(dāng)做 markdown 標(biāo)識(shí)符而發(fā)生不必要的格式轉(zhuǎn)化,可以在符號(hào)前加 \ 來(lái)避免。
- 書(shū)寫(xiě)格式
\*不是斜體\*
- 解析效果
* 不是斜體 *
整理一下,Markdown 支持以下這些符號(hào)前面加上 反斜杠 來(lái)幫助插入普通的符號(hào):
| 符號(hào) | 含義 |
|---|---|
\ |
反斜線 |
| ` | 反引號(hào) |
* |
星號(hào) |
_ |
底線 |
{} |
花括號(hào) |
[] |
方括號(hào) |
() |
括弧 |
# |
井字號(hào) |
+ |
加號(hào) |
- |
減號(hào) |
. |
英文句點(diǎn) |
! |
驚嘆號(hào) |
2.14 代碼高亮
使用柵欄標(biāo)記代碼塊的一個(gè)好處是可以標(biāo)明代碼的語(yǔ)種,然后實(shí)現(xiàn)代碼的高亮。
- 書(shū)寫(xiě)格式
```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```
- 解析效果
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
2.15 其他
2.15.1 錨點(diǎn)
網(wǎng)頁(yè)中,錨點(diǎn) 其實(shí)就是頁(yè)內(nèi)超鏈接,也就是 鏈接本文檔內(nèi)部的某些元素 ,實(shí)現(xiàn)當(dāng)前頁(yè)面中的跳轉(zhuǎn),最典型的例子就是 目錄 這種結(jié)構(gòu)了。比如我這里寫(xiě)下一個(gè)錨點(diǎn),點(diǎn)擊 回到目錄,就能跳轉(zhuǎn)到 目錄。 在 目錄 中點(diǎn)擊 這一節(jié),就能跳過(guò)來(lái)。
在 Github 的 md 文件中,會(huì)為每個(gè) h1~h6 標(biāo)簽(即 # ... ###### ),自動(dòng)塞入一個(gè) a 標(biāo)簽,并渲染好 id 。
比如 # h1,被渲染成html如下:
<h1>
<a id="user-content-h1" class="anchor" href="#h1" aria-hidden="true">
<svg aria-hidden="true" class="octicon octicon-link" height="16" role="img" version="1.1" viewBox="0 0 16 16" width="16">
<path d="M4 9h1v1h-1c-1.5 0-3-1.69-3-3.5s1.55-3.5 3-3.5h4c1.45 0 3 1.69 3 3.5 0 1.41-0.91 2.72-2 3.25v-1.16c0.58-0.45 1-1.27 1-2.09 0-1.28-1.02-2.5-2-2.5H4c-0.98 0-2 1.22-2 2.5s1 2.5 2 2.5z m9-3h-1v1h1c1 0 2 1.22 2 2.5s-1.02 2.5-2 2.5H9c-0.98 0-2-1.22-2-2.5 0-0.83 0.42-1.64 1-2.09v-1.16c-1.09 0.53-2 1.84-2 3.25 0 1.81 1.55 3.5 3 3.5h4c1.45 0 3-1.69 3-3.5s-1.5-3.5-3-3.5z">
</path>
</svg>
</a>
h1
</h1>
不去管 svg 部分,可以看到 h1 標(biāo)簽內(nèi)嵌入了一個(gè) id 為 "user-content-h1" 的 a 標(biāo)簽,如果標(biāo)題為 # h5 ,那么 id 就會(huì)是 user-content-h5 。
2.15.2 空格
在段首加入  、 、 來(lái)輸入空格,其中,  是一個(gè)中文字符,  是半個(gè)中文字符 , 是1/4中文字符。
2.15.3 圖片圖床
插入圖片的地址需要圖床,那么,究竟什么是圖床呢?
圖床,顧名思義,圖片床,即大量圖片匯聚地,每一張圖片都有一個(gè)url,供所需站點(diǎn)使用。
詳情可以參考我之前寫(xiě)的博文 圖床工具分享 。
另外,越來(lái)越多的 Markdown 工具現(xiàn)在開(kāi)始支持 一鍵上傳圖片至云端并生成 Markdown 引用鏈接至剪切板,可以看看最近的我最近在這方面的 收獲總結(jié) —— Md2All Markdown排版利器 以及 qiniu_upload windows工具。
ps:七牛云邀請(qǐng)注冊(cè)鏈接:https://portal.qiniu.com/signup?code=3lowm9s25ur82
2.15.4 LaTeX公式
行內(nèi)公式($表示)
- 書(shū)寫(xiě)格式
愛(ài)因斯坦發(fā)明的質(zhì)能方程是:$E=mc^2$
- 顯示效果
愛(ài)因斯坦發(fā)明的質(zhì)能方程是:E=mc^2
整行公式($$表示)
- 書(shū)寫(xiě)格式
$$\sum_{i=1}^n a_i=0$$
$$f(x_1,x_x,\ldots,x_n) = x_1^2 + x_2^2 + \cdots + x_n^2 $$
$$\sum^{j-1}_{k=0}{\widehat{\gamma}_{kj} z_k}$$
- 顯示效果
\sum_{i=1}^n a_i=0
f(x_1,x_x,\ldots,x_n) = x_1^2 + x_2^2 + \cdots + x_n^2
\sum^{j-1}_{k=0}{\widehat{\gamma}_{kj} z_k}
2.15.5 流程圖、渲染序列圖
流程圖
```flow
st=>start: Start:>https://www.zybuluo.com
io=>inputoutput: verification
op=>operation: Your Operation
cond=>condition: Yes or No?
sub=>subroutine: Your Subroutine
e=>end
st->io->op->cond
cond(yes)->e
cond(no)->sub->io
```

渲染序列圖
```sequence
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
```

2.15.6 GitHub Emoji
Github 的 Markdown 語(yǔ)法支持添加 emoji 表情,輸入不同的符號(hào)碼(兩個(gè)冒號(hào)包圍的字符)可以顯示出不同的表情。
我在 github 上分享了 markdown-emoji 列表,可以去看看。

可是奇怪的是,我的GitHub Pages 采用 Hexo框架,渲染不出 emoji 表情(不支持),這是為什么呢?
這是因?yàn)?Hexo 默認(rèn)的 markdown 渲染引擎不會(huì)渲染 emoji 表情,詳情可參閱 搭建Hexo博客進(jìn)階篇
2.16 Markdown的局限性
- 不同的 Markdown 工具功能細(xì)節(jié)上可能會(huì)不一樣
- 寫(xiě)技術(shù)類文章條理很重要,因此在開(kāi)篇有個(gè)目錄,也顯得非常有必要,因此越來(lái)越多工具支持
[TOC]一鍵生成目錄列表,具體可參看我的 github-md-toc - 另外還有,
流程圖,渲染序列圖,LaTex數(shù)學(xué)公式,代碼語(yǔ)法高亮,顯示代碼行號(hào),圖片/文字 居中/左右對(duì)齊,[TOC]目錄生成,等等這些,其實(shí)都是非常必要的功能,值得去做一些擴(kuò)展。
3. Markdown 工具的選擇
還是那句話,編輯器的興盛固然是好事,但工具的過(guò)度豐富也是一種麻煩,如何選出適合自己的 Markdown 編輯器讓很多人大傷腦筋,甚至在很多時(shí)候,一個(gè)設(shè)計(jì)不佳的 Markdown 編輯器會(huì)讓初次嘗試 Markdown 的寫(xiě)作者放棄使用 Markdown 來(lái)寫(xiě)作。
3.1 Windows 平臺(tái)
3.1.1 Sublime
- 支持 OS X、Windows、Ubuntu 等 UNIX 及 Linux 平臺(tái)
- 關(guān)聯(lián)閱讀:強(qiáng)大的Sublime編輯器
- Sublime Text 是程序員圈子里口口相傳的「神器」級(jí)代碼編輯器,它基于 Vim 開(kāi)發(fā),各種功能性組件層出不窮,功能極度強(qiáng)大,是代碼編輯器中的標(biāo)桿作品。
- 同時(shí),它也支持 Markdown 語(yǔ)法高亮,于是很多人都習(xí)慣于用它來(lái)進(jìn)行 Markdown 文檔書(shū)寫(xiě)。由于有著諸如 Markdown Preview、Sublime-Evernote 等擴(kuò)展性插件,在 Sublime Text 里完全可以完成 Makrdown 書(shū)寫(xiě)預(yù)覽與導(dǎo)出的過(guò)程。
-
如果你是一名開(kāi)發(fā)者,Sublime Text 基本可以滿足你對(duì) Markdown 編輯的全部需求,如果你是一名普通用戶,我則更推薦你使用專業(yè)的 Markdown 編輯器。
image
3.1.2 簡(jiǎn)書(shū)
-
簡(jiǎn)書(shū)的Web 端使用 Markdown 很舒服,它同樣支持左右兩欄的實(shí)時(shí)預(yù)覽,字體優(yōu)雅、簡(jiǎn)潔。
簡(jiǎn)書(shū)
3.1.3 Cmd Markdown
- 除了編輯,管理您的私有文檔,Cmd Markdown 還支持發(fā)布文稿,您可以在這里將文稿共享給朋友、親友、同事。
-
支持 Linux、Mac、Windows 三大平臺(tái),輕松選擇適合你的客戶端
Cmd Markdown
Cmd Markdown 全平臺(tái)端 優(yōu)勢(shì)
3.1.4 馬克飛象
- 支持 Windows 平臺(tái)
- 專為 印象筆記 打造的 Markdown 編輯器
馬克飛象
3.1.5 為知筆記
- 支持 Windows 平臺(tái)
-
作為一個(gè)支持全平臺(tái)的云筆記應(yīng)用,為知筆記完全可以當(dāng)作 Markdown 編輯器來(lái)使用,當(dāng)我們需要跨大平臺(tái)進(jìn)行 Markdown 協(xié)作寫(xiě)作的時(shí)候,會(huì)是一個(gè)不錯(cuò)的選擇。
為知筆記
3.1.6 Simple MarkPad
- Simple Markpad 最吸引人的一點(diǎn)就是,在諸多看起來(lái)就讓人覺(jué)復(fù)雜的 Windows 平臺(tái)的 Markdown 編輯器中,它始終保持著簡(jiǎn)約的風(fēng)格。
-
它支持自動(dòng)列表、圖片拖入、Markdown 語(yǔ)法高亮、全屏寫(xiě)作模式、字?jǐn)?shù)統(tǒng)計(jì),還有豐富的快捷鍵,同時(shí)具有著素雅而克制的界面風(fēng)格。
image
3.1.7 MarkPad
-
支持 Windows 平臺(tái)
MarkPad
3.1.8 Miu
- 支持 Windows 平臺(tái)
- 一個(gè)很優(yōu)秀的工具,但是由于和 Mou 重復(fù)性比較高,同時(shí)與其有些爭(zhēng)議問(wèn)題,故并未介紹,有興趣的話可以自行查看。
Miu
3.2 Mac 平臺(tái)
3.2.1 Mou
- Mou 是一款由國(guó)人開(kāi)發(fā)的 Mac 平臺(tái)上的 Markdown 編輯器,支持自定義界面主題,導(dǎo)入輸出CSS格式文件,最重要的是 Mou 支持 Markdown 實(shí)時(shí)預(yù)覽,這讓不少初學(xué)者能快速上手 Markdown 寫(xiě)作。
-
Mou 除了直觀的實(shí)時(shí)預(yù)覽功能之外,還是目前對(duì)中文支持最好的 Markdown 編輯器,無(wú)論是多種的編輯主題,還是各式的輸出樣式,在支持自定義的同時(shí),對(duì)中文的優(yōu)化也是目前的最好的,Mou 甚至支持豎排編寫(xiě)。同時(shí),Mou 還具有發(fā)布功能,支持發(fā)布到 Tumblr。
image
3.2.2 Ulysses
- 作為 Markdown 編輯器領(lǐng)域的老牌王者,這款應(yīng)用入圍了蘋(píng)果2013年 Mac App Store 的 The Best of 2013。Ulysses 有著經(jīng)典的文檔庫(kù)架構(gòu),多樣化的可供自定義的編輯主題,大量的輸出格式選擇,功能豐富,最適合長(zhǎng)文寫(xiě)作與顏控用戶。
-
無(wú)論是 PDF 還是 ePub 格式你都可以在官網(wǎng)下載到大量的現(xiàn)成格式模版,省去大量的用在排版上的時(shí)間,你需要做的只是按照自己的想法寫(xiě)完文章,之后就可以通過(guò) Ulysses 導(dǎo)出成任意自己想要的格式了。
image
3.2.3 Byword
- 如果說(shuō) Ulysses 是功能最豐富的 Markdown 編輯器,Byword 就是最簡(jiǎn)約的 Markdown 編輯器。同樣作為 Apple 平臺(tái)上的老牌編輯器,Byword 有著一種簡(jiǎn)約克制的氣質(zhì),僅有 6.4 MB 的體量,卻創(chuàng)造出了一個(gè)完美而純粹的寫(xiě)作環(huán)境。
- 在我看來(lái) Byword 應(yīng)該是目前編輯器中最忠于 Markdown 語(yǔ)言發(fā)明初衷的的編輯器 —— 簡(jiǎn)單、干凈、利落,All for writing feelings。
image
3.2.4 typora
- 支持 Mac 與 Windows 平臺(tái)
- 關(guān)聯(lián)閱讀: 《讓 Markdown 寫(xiě)作更簡(jiǎn)單,免費(fèi)極簡(jiǎn)編輯器:Typora》
這款編輯器在大家都還在苦惱如何處理預(yù)覽和寫(xiě)作界面之間的關(guān)系時(shí)候,機(jī)智的將「寫(xiě)作」和「預(yù)覽」合二為一了,你輸入的地方,即是你輸出的地方。 -
Markdown 標(biāo)記成為了類似快捷鍵一樣的存在,你就像在使用一個(gè)所見(jiàn)即所編輯器一樣,自然而快速的進(jìn)行寫(xiě)作??梢哉f(shuō),Typora 完全顛覆了目前的 Markdown 編輯器的交互模式,將 Markdown 寫(xiě)作向普通用戶推進(jìn)了一大步。
image - Typora 的革新不止于此,它還提供了了類似 Office 的圖像式表格建立方式,支持目錄大綱生成,支持拖拽插入圖片,并且支持所有主流代碼的高亮與 LaTeX 公式編寫(xiě)。
-
可以說(shuō) Typora 是目前 Markdown 編輯器中功能最與眾不同的一個(gè),諸多新鮮而強(qiáng)大的功能讓它卓爾不群,絕對(duì)值得嘗試。
image
3.2.5 Quiver
- 關(guān)聯(lián)閱讀:《技術(shù)寫(xiě)作者的專屬筆記本:Quiver》
- Quiver 同樣是一款國(guó)人開(kāi)發(fā)的軟件。它具有著強(qiáng)大的 Markdown 編輯能力,但同時(shí)又不僅限于此。
- 它集合了寫(xiě)作軟件與筆記軟件的特點(diǎn),它既有著傳統(tǒng) Markdown 寫(xiě)作軟件的實(shí)時(shí)編輯預(yù)覽,又有著筆記軟件的文件邏輯結(jié)構(gòu),同時(shí)它還內(nèi)置了 Ace 代碼編輯器,通過(guò) Cell 的概念,將各種不同的格式組合在一起,最后形成一個(gè)個(gè)文件。
-
Quiver 可以說(shuō)是一款為技術(shù)寫(xiě)作設(shè)計(jì)的,專注于筆記方向的 Markdown 編輯器,它能夠在為你提供流暢的 Markdown 寫(xiě)作體驗(yàn)的同時(shí),為你構(gòu)建起一個(gè)良好的知識(shí)管理結(jié)構(gòu)。
image
3.2.6 Alternote
- 同為 Mac 平臺(tái)上的筆記式 Markdown 編輯軟件,Alternote 則是為印象筆記進(jìn)行了深度定制,成為了一款簡(jiǎn)約輕量的第三方印象筆記客戶端。它拋棄了印象筆記臃腫的架構(gòu),專注于對(duì)寫(xiě)作體驗(yàn)的優(yōu)化,深度重構(gòu)了印象筆記對(duì)對(duì)于 Markdown 寫(xiě)作者的意義。
-
在 Alternote 里,Markdown 標(biāo)記在輸入完成后會(huì)自動(dòng)轉(zhuǎn)換成對(duì)應(yīng)的富文本格式,并不需要額外的預(yù)覽,不過(guò)美中不足的是,這樣也造成了一旦轉(zhuǎn)換為富文本就無(wú)法再轉(zhuǎn)換回來(lái)的問(wèn)題。
Alternote
3.2.7 SnippetsLab
- Snippetslab9 是一款 Mac 平臺(tái)的面向開(kāi)發(fā)者的代碼管理與編寫(xiě)工具,專注于幫助使用者收集整理代碼片段,快速調(diào)用有價(jià)值的代碼片段,打造屬于個(gè)人的代碼倉(cāng)庫(kù)。
- 那么它和 Markdown 的關(guān)系在哪里呢?奧秘就在它的菜單欄助手上。Snippetslab 的菜單欄助手有著類似印象筆記菜單欄助手的特性,支持在菜單欄打開(kāi)小窗口進(jìn)行程序編寫(xiě),同時(shí)可以對(duì)代碼進(jìn)行語(yǔ)法高亮,而它正好也支持 Markdown。
-
目前所有平臺(tái)中,Snippetslab 是唯一一款提供了菜單欄 Markdown 文字輸入的應(yīng)用,你可以在不用打開(kāi)主題程序的情況下,以小視窗形式快速的進(jìn)行 Markdown 編寫(xiě)。
image
3.2.8 MarkdownPad
-
支持 Mac 平臺(tái)
image
3.3 網(wǎng)頁(yè)版(線上)
- 程序猿DD - 常用工具:Markdown轉(zhuǎn)換工具
- 馬克飛象 - 專為印象筆記打造的Markdown編輯器
- Cmd Markdown編輯閱讀器 - 作業(yè)部落出品
- Dillinger, the Last Markdown Editor ever.
- StackEdit – In-browser Markdown editor
- Scribble - Simple Markdown Wiki
- Free Markdown to HTML Converter
- Draft. Write Better.
- Markable.in
- Markdown.css
同時(shí),也有一些 Markdown 相關(guān)瀏覽器插件也是很棒的,最典型的便是:Markdown-Here,我也有寫(xiě)一篇博文專門(mén)介紹分享了它 —— Markdown-Here md-2-html渲染
3.4 Others
- Editor.md - 開(kāi)源在線 Markdown 編輯器
- WriteMonkey
- DAUX.IO
- ReText
- Cmd Markdown
- vim
- Mango
- Haroopad
- iA Writer
- MarkdownX
- markItUp! Universal Markup jQuery Editor
3.5 More
如有更好的 Markdown 免費(fèi)編輯器推薦,請(qǐng)到這里留言反饋,謝謝~
4. 推薦閱讀
- MarkDown學(xué)習(xí)筆記
- 首次使用MarkDown好激動(dòng)
- 讓你的Markdown用起來(lái)得心應(yīng)手
- 一段JS代碼讓Markdown自動(dòng)生成側(cè)邊欄目錄
- Markdown 語(yǔ)法說(shuō)明 (簡(jiǎn)體中文版)
- 碼字必備:18 款優(yōu)秀的 Markdown 寫(xiě)作工具 | 2015 年度盤(pán)點(diǎn) - 少數(shù)派
5. 補(bǔ)充
2018/04/20 07:12

2018/08/05 20:36


















