Markdown學習筆記

Markdown語法

段落和換行

一個段落的結束是它的后面有一行空白,例如:

這是第一段

這是第二段

如果要換行的話,就需要在后面加兩個以上的空格,并回車,例如:

我想要這句話換行,
則必須在這句話的后面敲2個以上的空格,并回車。

標題

Markdown 支持兩種標題的語法,類 Setext 和類 atx 形式。

類 Setext 形式是用底線的形式,利用 = (最高階標題)和 - (第二階標題),例如:

This is an H1
=============

This is an H2
-------------

任何數量的 = 和 - 都可以有效果。

類 Atx 形式則是在行首插入 1 到 6 個 # ,對應到標題 1 到 6 階,例如:

# 這是 H1

## 這是 H2

###### 這是 H6

你可以選擇性地「閉合」類 atx 樣式的標題,這純粹只是美觀用的,若是覺得這樣看起來比較舒適,你就可以在行尾加上 #,而行尾的 # 數量也不用和開頭一樣(行首的井字符數量決定標題的階數):

# 這是 H1 #

## 這是 H2 ##

### 這是 H3 ######

區(qū)塊引用 Blockquotes

在引用的話前加>號,例如:

“道可道,非常道”。----《道德經》

也可以嵌套引用,例如:

這里是引用的話1

這里是引用的話2

引用的區(qū)塊內也可以使用其他的 Markdown 語法,包括標題、列表、代碼區(qū)塊等:

> ## 這是一個標題。
> 
> 1.   這是第一行列表項。
> 2.   這是第二行列表項。
> 
> 給出一些例子代碼:
> 
>     return shell_exec("echo $input | $markdown_script");

列表

Markdown 支持有序列表和無序列表。

無序列表使用星號、加號或是減號作為列表標記:

*   Red
*   Green
*   Blue

等同于:

+   Red
+   Green
+   Blue

也等同于:

-   Red
-   Green
-   Blue

有序列表則使用數字接著一個英文句點:

1.  Bird
2.  McHale
3.  Parish

代碼區(qū)塊

和程序相關的寫作或言是標簽語原始碼通常會有已經排版好的代碼區(qū)塊,通常這些區(qū)塊我們并不希望它以一般段落文件的方式去排版,而是照原來的樣子顯示,Markdown 會用 < pre> 和 < code> 標簽來把代碼區(qū)塊包起來。

要在 Markdown 中建立代碼區(qū)塊很簡單,只要簡單地縮進 4 個空格或是 1 個制表符就可以,例如,下面的輸入:

這是一個普通段落:

    這是一個代碼區(qū)塊。

Markdown 會轉換成:

<p>這是一個普通段落:</p>

<pre><code>這是一個代碼區(qū)塊。
</code></pre>

這個每行一階的縮進(4 個空格或是 1 個制表符),都會被移除,例如:

Here is an example of AppleScript:

    tell application "Foo"
        beep
    end tell

會被轉換為:

<p>Here is an example of AppleScript:</p>

<pre><code>tell application "Foo"
    beep
end tell
</code></pre>

一個代碼區(qū)塊會一直持續(xù)到沒有縮進的那一行(或是文件結尾)。

在代碼區(qū)塊里面, & 、 < 和 > 會自動轉成 HTML 實體,這樣的方式讓你非常容易使用 Markdown 插入范例用的 HTML 原始碼,只需要復制貼上,再加上縮進就可以了,剩下的 Markdown 都會幫你處理,例如:

<div class="footer">
    ? 2004 Foo Corporation
</div>

會被轉換為:

<pre><code><div class="footer">
    ? 2004 Foo Corporation
</div>
</code></pre>

代碼區(qū)塊中,一般的 Markdown 語法不會被轉換,像是星號便只是星號,這表示你可以很容易地以 Markdown 語法撰寫 Markdown 語法相關的文件。

分割線

你可以在一行中用三個以上的星號、減號、底線來建立一個分隔線,行內不能有其他東西。你也可以在星號或是減號中間插入空格。下面每種寫法都可以建立分隔線:

* * *

***

*****

- - -

---------------------------------------

區(qū)段元素(Span Elements)

連接

Markdown 支持兩種形式的鏈接語法: 行內式和參考式兩種形式。

不管是哪一種,鏈接文字都是用 [方括號] 來標記。

要建立一個行內式的鏈接,只要在方塊括號后面緊接著圓括號并插入網址鏈接即可,如果你還想要加上鏈接的 title 文字,只要在網址后面,用雙引號把 title 文字包起來即可,例如:

This is [an example](http://example.com/ "Title") inline link.

[This link](http://example.net/) has no title attribute.

會產生:

<p>This is <a  title="Title">
an example</a> inline link.</p>

<p><a >This link</a> has no
title attribute.</p>

如果你是要鏈接到同樣主機的資源,你可以使用相對路徑:

See my [About](/about/) page for details.

參考式的鏈接是在鏈接文字的括號后面再接上另一個方括號,而在第二個方括號里面要填入用以辨識鏈接的標記:

This is [an example][id] reference-style link.

你也可以選擇性地在兩個方括號中間加上一個空格:

This is [an example] [id] reference-style link.

接著,在文件的任意處,你可以把這個標記的鏈接內容定義出來:

[id]: http://example.com/  "Optional Title Here"

鏈接內容定義的形式為:

  • 方括號(前面可以選擇性地加上至多三個空格來縮進),里面輸入鏈接文字
  • 接著一個冒號
  • 接著一個以上的空格或制表符
  • 接著鏈接的網址
  • 選擇性地接著 title 內容,可以用單引號、雙引號或是括弧包著

下面這三種鏈接的定義都是相同:

[foo]: http://example.com/  "Optional Title Here"
[foo]: http://example.com/  'Optional Title Here'
[foo]: http://example.com/  (Optional Title Here)

請注意:有一個已知的問題是 Markdown.pl 1.0.1 會忽略單引號包起來的鏈接 title。

鏈接網址也可以用尖括號包起來:

[id]: <http://example.com/>  "Optional Title Here"

你也可以把 title 屬性放到下一行,也可以加一些縮進,若網址太長的話,這樣會比較好看:

[id]: http://example.com/longish/path/to/resource/here
    "Optional Title Here"

網址定義只有在產生鏈接的時候用到,并不會直接出現在文件之中。

鏈接辨別標簽可以有字母、數字、空白和標點符號,但是并不區(qū)分大小寫,因此下面兩個鏈接是一樣的:

[link text][a]
[link text][A]

隱式鏈接標記功能讓你可以省略指定鏈接標記,這種情形下,鏈接標記會視為等同于鏈接文字,要用隱式鏈接標記只要在鏈接文字后面加上一個空的方括號,如果你要讓 "Google" 鏈接到 google.com,你可以簡化成:

[Google][]

然后定義鏈接內容:

[Google]: http://google.com/

由于鏈接文字可能包含空白,所以這種簡化型的標記內也許包含多個單詞:

Visit [Daring Fireball][] for more information.

然后接著定義鏈接:

[Daring Fireball]: http://daringfireball.net/

鏈接的定義可以放在文件中的任何一個地方,我比較偏好直接放在鏈接出現段落的后面,你也可以把它放在文件最后面,就像是注解一樣。

下面是一個參考式鏈接的范例:

I get 10 times more traffic from [Google] [1] than from
[Yahoo] [2] or [MSN] [3].

  [1]: http://google.com/        "Google"
  [2]: http://search.yahoo.com/  "Yahoo Search"
  [3]: http://search.msn.com/    "MSN Search"

如果改成用鏈接名稱的方式寫:

I get 10 times more traffic from [Google][] than from
[Yahoo][] or [MSN][].

  [google]: http://google.com/        "Google"
  [yahoo]:  http://search.yahoo.com/  "Yahoo Search"
  [msn]:    http://search.msn.com/    "MSN Search"

上面兩種寫法都會產生下面的 HTML。

<p>I get 10 times more traffic from <a 
title="Google">Google</a> than from
<a  title="Yahoo Search">Yahoo</a>
or <a  title="MSN Search">MSN</a>.</p>

下面是用行內式寫的同樣一段內容的 Markdown 文件,提供作為比較之用:

I get 10 times more traffic from [Google](http://google.com/ "Google")
than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or
[MSN](http://search.msn.com/ "MSN Search").

參考式的鏈接其實重點不在于它比較好寫,而是它比較好讀,比較一下上面的范例,使用參考式的文章本身只有 81 個字符,但是用行內形式的卻會增加到 176 個字元,如果是用純 HTML 格式來寫,會有 234 個字元,在 HTML 格式中,標簽比文本還要多。

使用 Markdown 的參考式鏈接,可以讓文件更像是瀏覽器最后產生的結果,讓你可以把一些標記相關的元數據移到段落文字之外,你就可以增加鏈接而不讓文章的閱讀感覺被打斷。

強調

Markdown 使用星號(*)和底線(_)作為標記強調字詞的符號,被 * 或 _ 包圍的字詞會被轉成用 < em> 標簽包圍,用兩個 * 或 _ 包起來的話,則會被轉成 < strong>,例如:

*single asterisks*

_single underscores_

**double asterisks**

__double underscores__

會轉成:

<em>single asterisks</em>

<em>single underscores</em>

<strong>double asterisks</strong>

<strong>double underscores</strong>

你可以隨便用你喜歡的樣式,唯一的限制是,你用什么符號開啟標簽,就要用什么符號結束。

強調也可以直接插在文字中間:

un*frigging*believable

但是如果你的 * 和 _ 兩邊都有空白的話,它們就只會被當成普通的符號。

如果要在文字前后直接插入普通的星號或底線,你可以用反斜線:

\*this text is surrounded by literal asterisks\*

代碼

如果要標記一小段行內代碼,你可以用反引號把它包起來(`),例如:

Use the `printf()` function.

會產生:

<p>Use the <code>printf()</code> function.</p>

如果要在代碼區(qū)段內插入反引號,你可以用多個反引號來開啟和結束代碼區(qū)段:

``There is a literal backtick (`) here.``

這段語法會產生:

<p><code>There is a literal backtick (`) here.</code></p>

代碼區(qū)段的起始和結束端都可以放入一個空白,起始端后面一個,結束端前面一個,這樣你就可以在區(qū)段的一開始就插入反引號:

A single backtick in a code span: `` ` ``

A backtick-delimited string in a code span: `` `foo` ``

會產生:

<p>A single backtick in a code span: <code>`</code></p>

<p>A backtick-delimited string in a code span: <code>`foo`</code></p>

在代碼區(qū)段內,& 和尖括號都會被自動地轉成 HTML 實體,這使得插入 HTML 原始碼變得很容易,Markdown 會把下面這段:

Please don't use any `<blink>` tags.

轉為:

<p>Please don't use any <code><blink></code> tags.</p>

你也可以這樣寫:

`—` is the decimal-encoded equivalent of `—`.

以產生:

<p><code>—</code> is the decimal-encoded
equivalent of <code>—</code>.</p>

圖片

很明顯地,要在純文字應用中設計一個「自然」的語法來插入圖片是有一定難度的。

Markdown 使用一種和鏈接很相似的語法來標記圖片,同樣也允許兩種樣式: 行內式和參考式。

行內式的圖片語法看起來像是:

![](/path/to/img.jpg)

![](/path/to/img.jpg "Optional title")

詳細敘述如下:

  • 一個驚嘆號 !

  • 接著一個方括號,里面放上圖片的替代文字

  • 接著一個普通括號,里面放上圖片的網址,最后還可以用引號包住并加上選擇性的 'title' 文字。

  • 參考式的圖片語法則長得像這樣:

    ![Alt text][id]

「id」是圖片參考的名稱,圖片參考的定義方式則和連結參考一樣:

[id]: url/to/image  "Optional title attribute"

到目前為止, Markdown 還沒有辦法指定圖片的寬高,如果你需要的話,你可以使用普通的 <img> 標簽。

其他

自動連接

Markdown 支持以比較簡短的自動鏈接形式來處理網址和電子郵件信箱,只要是用尖括號包起來, Markdown 就會自動把它轉成鏈接。一般網址的鏈接文字就和鏈接地址一樣,例如:

<http://example.com/>

Markdown 會轉為:

<a >http://example.com/</a>

郵址的自動鏈接也很類似,只是 Markdown 會先做一個編碼轉換的過程,把文字字符轉成 16 進位碼的 HTML 實體,這樣的格式可以糊弄一些不好的郵址收集機器人,例如:

<address@example.com>

Markdown 會轉成:

<a href="mailto:addre
ss@example.co
m">address@exa
mple.com</a>

在瀏覽器里面,這段字串(其實是 < a href="mailto:address@example.com">address@example.com</a>)會變成一個可以點擊的「address@example.com」鏈接。

(這種作法雖然可以糊弄不少的機器人,但并不能全部擋下來,不過總比什么都不做好些。不管怎樣,公開你的信箱終究會引來廣告信件的。)

反斜杠

Markdown 可以利用反斜杠來插入一些在語法中有其它意義的符號,例如:如果你想要用星號加在文字旁邊的方式來做出強調效果(但不用 < em> 標簽),你可以在星號的前面加上反斜杠:

\*literal asterisks\*

Markdown 支持以下這些符號前面加上反斜杠來幫助插入普通的符號:

\   反斜線
`   反引號
*   星號
_   底線
{}  花括號
[]  方括號
()  括弧
#   井字號
+   加號
-   減號
.   英文句點
!   驚嘆號
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 為什么學習Markdown 自從搭建了 Hexo 博客之后,發(fā)現還有 Markdown 這種寫文章的方法,想到以后...
    lifeColder閱讀 20,446評論 10 216
  • 前言 一直很想好好打理自己的博客,可是每次寫學習筆記之類的東東的時候都備受折磨。終于,在昨天,我遇見了Markdo...
    零小白閱讀 1,275評論 0 4
  • 1 區(qū)塊元素 1.1 段落 一個 Markdown 段落是由一個或多個連續(xù)的文本行組成,它的前后要有一個以上的空行...
    markouy閱讀 1,024評論 0 0
  • 原文地址:LoveDev Markdown:一種簡單易學功能強大、任何文本編輯器都可以編寫的標記語言。目前 git...
    KevinLive閱讀 283評論 0 1
  • MarkDown語法學習 這是一個HTML表格 Foo Sun Big Ted 版權符號? &符號AT&...
    阿咿呀嘿閱讀 332評論 0 1

友情鏈接更多精彩內容