387
技術社區[雲棲]
markdown的介紹學習
接觸到了一個新的文本編輯器,感覺棒棒噠,所以來把我學習到的東西分享給大家:
概述
可讀性,無論如何,都是最重要的;一份使用Markdown格式撰寫的文件應該可以直接以純文本發布,並且看起來不會像是由許多標簽或是格式指令所構成;Markdown語法受到一些既有text-to-HTML格式的影響,包括Setext、atx、Textile、reStructuredText、Grutatext 和EtText,而最大靈感來源其實是純文本電子郵件的格式。Markdown的語法十分簡單,常用的標記符號也不超過十個,相對於更為複雜的HTML標記語言來說,Markdown可謂是十分輕量的,學習成本也不需要太多,且一旦熟悉這種語法規則,會有一勞永逸的效果。
Markdown使我們專心於碼字,用「標記」語法,來代替常見的排版格式;Markdown從寫作到完成,你可以導出HTML格式的文件用來網站發布,也可以十分方便的導出PDF格式;甚至可以利用CloudApp這種雲服務工具直接上傳至網頁用來分享你的文章,全球最大的輕博客平台Tumblr也支持使用Mou這類Markdown工具進行編輯並直接上傳。
標簽使用
說了那麼多Markdown的有點,下麵來看看Markdown的常用標記到底有哪些吧:
兼容HTML
不在Markdown涵蓋範圍內的標簽,都可以直接在文檔裏用HTML撰寫,不需要額外標注這是 HTML或是Markdown,隻要直接加標簽就可以了;
例如下麵這個普通html語句:
one | two |
three | four |
請注意,在HTML區塊標簽間的Markdown格式語法將不會被處理。比如,你在HTML區塊內使用Markdown樣式的*強調*會沒有效果。
HTML的區段(行內)標簽如 <span>、<cite>、<del>
可以在Markdown的段落、列表或是標題裏隨意使用;依照個人習慣,甚至可以不用Markdown格式,而直接采用HTML標簽來格式化;和處在HTML區塊標簽間不同,Markdown語法在HTML區段標簽間是有效的。
特殊字符自動轉換
在HTML文件中,有兩個字符需要特殊處理:< 和 & ; < 符號用於起始標簽,&符號則用於標記HTML實體,如果隻是想要顯示這些字符的原型,你必須要使用實體的形式,像是 < 和 &而且網址中的&符也要轉換。Markdown讓你可以自然地書寫字符,需要轉換的由它來處理,如果你使用的&字符是HTML字符實體的一部分,它會保留原狀,否則它會被轉換成&
例如你要在文檔中插入一個版權符號就寫成:©
,Markdown會保留它不動,而若你寫 AT&T
,Markdown就會將它轉為 AT&T
。類似的狀況也會發生在 < 符號上,因為Markdown允許兼容HTML
區塊元素
段落和換行
一個markdown段落是由一個或多個連續的文本行組成,他的前後要有一個以上的空行;如果你想要依賴markdown來插入
標簽的話,在插入處先按入兩個以上的空格然後回車。
標題
markdow支持兩種標題的語法,類Setext和類atx形式.
類Setext形式是用底線的形式,利用 (最高階標題) = 和 -(第二階標題),例如:
This is an H1
This is an H2
類 Atx 形式則是在行首插入 1 到 6 個 # ,對應到標題 1 到 6 階,例如:
這是 H1
這是 H2
這是 H6
你可以選擇性地「閉合」類 atx 樣式的標題,這純粹隻是美觀用的,若是覺得這樣看起來比較舒適,你就可以在行尾加上 #,而行尾的 # 數量也不用和開頭一樣(行首的井字符數量決定標題的階數)
區塊引用Blockquotes
Markdown 標記區塊引用是使用類似email中用>的引用方式;如果你還熟悉在email信件中的引言部分,你就知道怎麼在Markdown文件中建立一個區塊引用,那會看起來像是你自己先斷好行,然後在每行的最前麵加上 > :
This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
Markdown 也允許你偷懶隻在整個段落的第一行最前麵加上 > :
This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
區塊引用可以嵌套(例如:引用內的引用),隻要根據層次加上不同數量的 > :
This is the first level of quoting.
This is nested blockquote.
Back to the first level.
任何像樣的文本編輯器都能輕鬆地建立 email 型的引用。例如在 BBEdit 中,你可以選取文字後然後從選單中選擇增加引用階層
列表
Markdown 支持有序列表和無序列表。
無序列表使用星號、加號或是減號作為列表標記:
- Red
- Green
- Blue
有序列表則使用數字接著一個英文句點,而且順序不會因為列表前的數字而改變:
- Bird
- McHale
- Parish
列表項目標記通常是放在最左邊,但是其實也可以縮進,最多 3 個空格,項目標記後麵則一定要接著至少一個空格或製表符;要讓列表看起來更漂亮,你可以把內容用固定的縮進整理好:
如果列表項目間用空行分開,在輸出 HTML 時 Markdown 就會將項目內容用
標簽包起來,舉例來說:
- Bird
- Magic
會被轉換為:
<li>Bird</li>
<li>Magic</li>
</ul>
但是這個:
Bird
Magic
會被轉換為:
<ul>
<li><p>Bird</p></li>
<li><p>Magic</p></li>
</ul>
列表項目可以包含多個段落,每個項目下的段落都必須縮進 4 個空格或是 1 個製表符.
如果要在列表項目內放進引用,那 > 就需要縮進:
-
A list item with a blockquote:
This is a blockquote
inside a list item.
如果要放代碼區塊的話,該區塊就需要縮進兩次,也就是8個空格或是2個製表符
代碼區塊
和程序相關的寫作或是標簽語言原始碼通常會有已經排版好的代碼區塊,通常這些區塊我們並不希望它以一般段落文件的方式去排版,而是照原來的樣子顯示,Markdown會用 <pre>
和<code>
標簽來把代碼區塊包起來。
要在Markdown中建立代碼區塊很簡單,隻要簡單地縮進4個空格或是1個製表符就可以,例如,下麵的輸入:
這是一個普通段落:
<ul>
<li><p>Bird</p></li>
<li><p>Magic</p></li>
</ul>
這個每行一階的縮進(4 個空格或是 1 個製表符),都會被移除
一個代碼區塊會一直持續到沒有縮進的那一行(或是文件結尾);在代碼區塊裏麵, & 、 < 和 > 會自動轉成 HTML 實體,這樣的方式讓你非常容易使用 Markdown 插入範例用的 HTML 原始碼,隻需要複製貼上,再加上縮進就可以了,剩下的 Markdown 都會幫你處理.
代碼區塊中,一般的 Markdown 語法不會被轉換,像是星號便隻是星號,這表示你可以很容易地以 Markdown 語法撰寫 Markdown 語法相關的文件。
分割線
你可以在一行中用三個以上的星號、減號、底線來建立一個分隔線,行內不能有其他東西。你也可以在星號或是減號中間插入空格。下麵每種寫法都可以建立分隔線:
eg:
區段元素
鏈接
Markdown 支持兩種形式的鏈接語法: 行內式和參考式兩種形式;不管是哪一種,鏈接文字都是用 [方括號] 來標記;要建立一個行內式的鏈接,隻要在方塊括號後麵緊接著圓括號並插入網址鏈接即可,如果你還想要加上鏈接的 title 文字,隻要在網址後麵,用雙引號把 title 文字包起來即可,例如:
This is an example inline link.
如果你是要鏈接到同樣主機的資源,你可以使用相對路徑:See my About page for details.
參考式的鏈接是在鏈接文字的括號後麵再接上另一個方括號,而在第二個方括號裏麵要填入用以辨識鏈接的標記:This is [an example][id] reference-style link;
你也可以選擇性地在兩個方括號中間加上一個空格:This is [an example] [id] reference-style link;接著,在文件的任意處,你可以把這個標記的鏈接內容定義出來:[id]: https://example.com/ "Optional Title Here"
鏈接內容定義的形式為:
方括號(前麵可以選擇性地加上至多三個空格來縮進),裏麵輸入鏈接文字
接著一個冒號
接著一個以上的空格或製表符
接著鏈接的網址
選擇性地接著 title 內容,可以用單引號、雙引號或是括弧包著
下麵這三種鏈接的定義都是相同:
[foo]: https://example.com/ "Optional Title Here"
[foo]: https://example.com/ 'Optional Title Here'
[foo]: https://example.com/ (Optional Title Here)
請注意:有一個已知的問題是Markdown.pl 1.0.1會忽略單引號包起來的鏈接 title,鏈接網址也可以用方括號包起來。
網址定義隻有在產生鏈接的時候用到,並不會直接出現在文件之中;鏈接辨別標簽可以有字母、數字、空白和標點符號,但是並不區分大小寫,因此下麵兩個鏈接是一樣的:
[link text][a]
[link text][A]
隱式鏈接標記功能讓你可以省略指定鏈接標記,這種情形下,鏈接標記會視為等同於鏈接文字,要用隱式鏈接標記隻要在鏈接文字後麵加上一個空的方括號,如果你要讓 "Google" 鏈接到 google.com,你可以簡化成:[Google][]
由於鏈接文字可能包含空白,所以這種簡化型的標記內也許包含多個單詞
參考式的鏈接其實重點不在於它比較好寫,而是它比較好讀
強調
Markdown使用星號(*)和底線(_)作為標記強調字詞的符號,被 * 或 _ 包圍的字詞會被轉成用 <em>
標簽包圍,用兩個 * 或 _ 包起來的話,則會被轉成<strong>
,例如:
single asterisks
single underscores
double asterisks
double underscores
但是如果你的 * 和 _ 兩邊都有空白的話,它們就隻會被當成普通的符號;如果要在文字前後直接插入普通的星號或底線,你可以用反斜線:*this text is surrounded by literal asterisks*
代碼
如果要標記一小段行內代碼,你可以用反引號把它包起來(),例如:Use the
printf()` function.
如果要在代碼區段內插入反引號,你可以用多個反引號來開啟和結束代碼區段:There is a literal backtick (`) here.
在代碼區段內,& 和方括號都會被自動地轉成 HTML 實體,這使得插入 HTML 原始碼變得很容易
圖片
很明顯地,要在純文字應用中設計一個「自然」的語法來插入圖片是有一定難度的;Markdown 使用一種和鏈接很相似的語法來標記圖片,同樣也允許兩種樣式: 行內式和參考式。
行內式的圖片語法看起來像是:

詳細敘述如下:
一個驚歎號 !
接著一個方括號,裏麵放上圖片的替代文字
接著一個普通括號,裏麵放上圖片的網址,最後還可以用引號包住並加上 選擇性的 'title' 文字;到目前為止, Markdown 還沒有辦法指定圖片的寬高,如果你需要的話,你可以使用普通的 標簽。
其他
反斜杠
Markdown 可以利用反斜杠來插入一些在語法中有其它意義的符號,例如:如果你想要用星號加在文字旁邊的方式來做出強調效果(但不用 <em>
標簽),你可以在星號的前麵加上反斜杠
Markdown 支持以下這些符號前麵加上反斜杠來幫助插入普通的符號:
\ 反斜線
` 反引號
* 星號
_ 底線
{} 花括號
[] 方括號
() 括弧
# 井字號
+ 加號
- 減號
. 英文句點
! 驚歎號
`
自動鏈接
Markdown 支持以比較簡短的自動鏈接形式來處理網址和電子郵件信箱,隻要是用方括號包起來, Markdown 就會自動把它轉成鏈接。一般網址的鏈接文字就和鏈接地址一樣,如:
<https://example.com/>
- https://example.com/
郵址的自動鏈接也很類似,隻是 Markdown 會先做一個編碼轉換的過程,把文字字符轉成 16 進位碼的 HTML 實體,這樣的格式可以煳弄一些不好的郵址收集機器人,例如:
<address@example.com>
Markdown 會轉成:
address@example.com
在瀏覽器裏麵,這段字串(其實是 <a href="mailto:address@example.com">address@example.com</a>
)會變成一個可以點擊的「address@example.com」鏈接。
(這種作法雖然可以煳弄不少的機器人,但並不能全部擋下來,不過總比什麼都不做好些。不管怎樣,公開你的信箱終究會引來廣告信件的。)
最後更新:2017-04-17 14:30:38