Markdown的基本語(yǔ)法

Markdown是一種輕量級(jí)的[標(biāo)記語(yǔ)言],它的優(yōu)點(diǎn)很多,目前也被越來越多的寫作愛好者,撰稿者廣泛使用。看到這里請(qǐng)不要被[標(biāo)記]、[語(yǔ)言]所迷惑,Markdown的語(yǔ)法十分簡(jiǎn)單。常用的標(biāo)記符號(hào)也不超過十個(gè),這種相對(duì)于更為復(fù)雜的HTML標(biāo)記語(yǔ)言來說,Markdown可謂是十分輕量的,學(xué)習(xí)成本也不需要太多,且一旦熟悉這種語(yǔ)法規(guī)則,會(huì)有一勞永逸的效果。

廢話不多說,直接開干,來看看Markdown的基本語(yǔ)法規(guī)則。

標(biāo)題

標(biāo)題是每篇文章都需要也是最常用的格式,在Markdown中,如果一段文字被定義為標(biāo)題,只須在這段文字前加#號(hà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)題

以此類推,總共六級(jí)標(biāo)題,建議在#號(hào)后加一個(gè)空格,這是最標(biāo)準(zhǔn)的Markdown語(yǔ)法。
特別的,還可使用=(高階標(biāo)題)和-(次階標(biāo)題)標(biāo)記一級(jí)和二級(jí)標(biāo)題。
例,

這是高階標(biāo)題(效果和一級(jí)標(biāo)題一樣)
=
這是次階標(biāo)題(效果和二級(jí)標(biāo)題一樣)
-

效果:
這是高階標(biāo)題(效果和一級(jí)標(biāo)題一樣)
=
這是次階標(biāo)題(效果和二級(jí)標(biāo)題一樣)

注意:=-標(biāo)記標(biāo)題時(shí),=-的個(gè)數(shù)在不同的編輯器中都有不同,我在簡(jiǎn)書中測(cè)試時(shí),=-的個(gè)數(shù)大于等于2個(gè)都可以表示,但是在Cmd Markdown中只要1個(gè)就可表示,還有說必須要三個(gè)或者以上的,我真不知道該相信誰(shuí)的了,誰(shuí)能告訴我!

段落

段落的前后要有空行,所謂的空行是指沒有文字內(nèi)容。若想在段內(nèi)強(qiáng)制換行的方式是使用兩個(gè)或以上空格加上回車(引用中換行省略回車)。

列表

熟悉HTML的同學(xué)肯定知道有序列表與無序列表的區(qū)別,在Markdown下,列表的顯示只需要在文字前加上-+*即可變?yōu)闊o序列表,有序列表則直接在文字前加1. 2. 3.符號(hào)和文字之前加上一個(gè)字符的空格。
例1,有序列表

1. 第一點(diǎn)
2. 第二點(diǎn)
4. 第三點(diǎn)

效果:

  1. 第一點(diǎn)
  2. 第二點(diǎn)
  3. 第三點(diǎn)

例2,無序列表

- 這是無序列表項(xiàng)目
+ 這是無序列表項(xiàng)目
* 這是無序列表項(xiàng)目

效果:

  • 這是無序列表項(xiàng)目
  • 這是無序列表項(xiàng)目
  • 這是無序列表項(xiàng)目

兩個(gè)列表之間不能相鄰,否則會(huì)解釋為嵌套的列表。下面這個(gè)是嵌套的列表,例3,

+ 呵呵
    * 嘉嘉
    - 嘻嘻
    - 吼吼
        - 嘎嘎
        + 桀桀
* 哈哈

效果:

  • 呵呵
    • 嘉嘉
    • 嘻嘻
    • 吼吼
      • 嘎嘎
      • 桀桀
  • 哈哈

注意:

  1. 標(biāo)記后面最少有一個(gè)空格制表符
  2. 若不在引用區(qū)塊中,必須和前方段落之間存在空行,后面最好還是空一行,否則會(huì)解釋為嵌套的列表。
  3. 有序列表標(biāo)記不是按照你寫的數(shù)字進(jìn)行顯示的,而是根據(jù)當(dāng)前有序列表標(biāo)記所在位置顯示的,如示例1所示。
  4. 無序列表的項(xiàng)目符號(hào)是按照實(shí)心圓、空心圓、實(shí)心方格的層級(jí)關(guān)系遞進(jìn)的,如例3所示。通常情況下,同一層級(jí)使用同一種標(biāo)記表示,便于自己查看和管理。

引用

如果你需要引用一小段別處的句子,那么就要用引用的格式。只需要在文本前加入>這種尖括號(hào)(大于號(hào))即可。
例,

> 這是引用

效果:

這是引用

特別的,引用還可以嵌套,如:

> 這是一級(jí)引用
>> 這是二級(jí)引用
>>> 這是三級(jí)引用

> 這是一級(jí)引用

效果:

這是一級(jí)引用

這是二級(jí)引用

這是三級(jí)引用

這是一級(jí)引用

再如:

> 這是一級(jí)引用
>> 這是二級(jí)引用
>>> 這是三級(jí)引用
> 這是一級(jí)引用

效果:

這是一級(jí)引用

這是二級(jí)引用

這是三級(jí)引用
這是一級(jí)引用

  1. 從上面兩例可看出,如果>>>>>>等嵌套使用的話,從>>>退到>時(shí),必須之間要加上一個(gè)空行作為過渡,否則默認(rèn)為下一行和上一行是同一級(jí)別的引用。如上例所示。
  2. 引用完之后,必須再空一行,重新一個(gè)新的開始,否則,以后的文字都將在引用的范圍內(nèi),不要問我為什么,實(shí)踐出真知。

代碼塊

使用```表示代碼塊。如:

``` javascript
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
```

效果:

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");

注意:

  1. `這個(gè)符號(hào)是反引號(hào),我一開始在鍵盤上死命的找還找不到呢?鬧笑話了,這個(gè)符號(hào)在Esc鍵下面,切換到英文下即可。

  2. ```后面的javascript表示此段代碼為javascript代碼,Markdown會(huì)自行使用javascript代碼顏色渲染。
    附加:還可使用4個(gè)空格或者一個(gè)制表符(tab)縮進(jìn)表示代碼區(qū)塊。如:

     /** 
       * nth element in the fibonacci series. 
       * @param n >= 0 
       * @return the nth element, >= 0. 
       */
     function fib(n) { 
         var a = 1, b = 1; 
         var tmp; 
         while (--n >= 0) { 
             tmp = a;
             a += b; 
             b = tmp;
         }
         return a; 
     }
     document.write(fib(10));
    

效果:

/** 
 * nth element in the fibonacci series. 
 * @param n >= 0 
 * @return the nth element, >= 0. 
 */
function fib(n) {
    var a = 1, b = 1; 
    var tmp; 
    while (--n >= 0) { 
        tmp = a;
        a += b; 
        b = tmp;
    }
    return a; 
}
document.write(fib(10));

但是這樣寫代碼太費(fèi)勁了,每行的開頭都要空4個(gè)空格啊!要是成千上萬(wàn)行代碼呢?那不把人累死啊!這種方式一定是差評(píng)啊!
少量的代碼還可以接受啊!例,

    void main()
    {
        printf("Hello, Markdown.");
    }

效果:

void main()
{
    printf("Hello, Markdown.");
}

行內(nèi)代碼

使用``表示行內(nèi)代碼。如:

這是`java`代碼。

效果:
這是java代碼。
注意:需要和普通段落之間存在空行。

鏈接

鏈接可以由兩種形式生成:行內(nèi)式參考式

  • 使用[](link "Optional title")表示行內(nèi)鏈接。其中
  1. []內(nèi)的內(nèi)容為要添加鏈接的文字
  2. link為鏈接地址
  3. Optional title為顯示標(biāo)題。顯示效果為在你將鼠標(biāo)放到鏈接上后,會(huì)顯示一個(gè)小框提示,提示的內(nèi)容就是Optional title里的內(nèi)容。中文顯示亂碼啊!差評(píng)

例,

這就是行內(nèi)鏈接:[李阿昀的簡(jiǎn)書](http://www.lxweimin.com "李阿昀的簡(jiǎn)書")

效果:
這就是行內(nèi)鏈接:李阿昀的簡(jiǎn)書

  • 參考式鏈接

例,

這里我們參考:
1. [JavaScript | MDN][1]
2. [ECMAScript 6 入門 阮一峰][2]
3. [InfoQ JavaScript][3]
[1]: http://developer.mozilla.org/zh-CN/docs/Web/JavaScript
[2]: http://es6.ruanyifeng.com
[3]: http://www.infoq.com/cn/javascript/?utm_source=infoq&utm_medium=header_graybar&utm_campaign=topic_clk

效果:
這里我們參考:

  1. [JavaScript | MDN][1]
  2. [ECMAScript 6 入門 阮一峰][2]
  3. [InfoQ JavaScript][3]
    [1]: http://developer.mozilla.org/zh-CN/docs/Web/JavaScript
    [2]: http://es6.ruanyifeng.com
    [3]: http://www.infoq.com/cn/javascript/?utm_source=infoq&utm_medium=header_graybar&utm_campaign=topic_clk
    注意:
  4. 上述的[1]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript不出現(xiàn)在區(qū)塊中。
  5. 參考式鏈接和行內(nèi)鏈接的顯示效果是一樣的。但是在編輯狀態(tài)下的使用情況不一樣。行內(nèi)連接緊跟鏈接文字,可以在看到鏈接文字的同時(shí)清楚的知道鏈接地址,但是不便于多次重復(fù)利用。參考式鏈接可以重復(fù)使用,但一般都是將一些鏈接放在一起統(tǒng)一管理,如一段文字后面或文章結(jié)尾,因此在找到鏈接和鏈接文字的對(duì)應(yīng)關(guān)系上有些麻煩。各有利弊了,分情況使用。

圖片

插入圖片與插入鏈接的語(yǔ)法很像,區(qū)別在一個(gè)!號(hào),而且也有行內(nèi)式和參考式兩種。
插入圖片語(yǔ)法為:![Alt text](/path/to/img.jpg "Optional title")

  • Alt text為如果圖片無法顯示時(shí)顯示的文字。
  • /path/to/img.jpg為圖片所在路徑。
  • Optional title為顯示標(biāo)題。顯示效果為在你將鼠標(biāo)放到圖片上后,會(huì)顯示一個(gè)小框提示,提示的內(nèi)容就是Optional title

例,行內(nèi)式:

### 插入圖片
![圖靈社區(qū)](http://www.turingbook.com/Content/img/Turing.Gif)

效果:

插入圖片

圖靈社區(qū)
圖靈社區(qū)

例,參考式:

[圖靈社區(qū)][4]
![圖靈社區(qū)Logo][5]
[1]: http://www.ituring.com.cn
[2]: http://www.turingbook.com/Content/img/Turing.Gif

效果:
[圖靈社區(qū)][4]
![圖靈社區(qū)Logo][5]
[4]: http://www.ituring.com.cn
[5]: http://www.turingbook.com/Content/img/Turing.Gif


插入圖片的地址需要圖床(什么是圖床呢???),這里推薦圍脖圖床修復(fù)計(jì)劃CloudApp的服務(wù),生成URL地址即可。
推薦工具
圖床工具用來上傳圖片獲取URL地址。

首次上傳本地圖片時(shí),發(fā)現(xiàn)Cmd Markdown對(duì)普通用戶不友好,搞的差點(diǎn)放棄了,還得進(jìn)階為高級(jí)用戶上傳本地圖片功能才能使用,但我窮啊!以上推薦工具我也沒用,什么是圖床工具,我都不清楚,還是不搞了。
哈哈,那我就用新浪微博或者QQ空間存儲(chǔ)照片了,搞笑吧!

強(qiáng)調(diào)

使用**__表示粗體。
使用*_表示斜體。
例,

**粗體1**   __粗體2__
*斜體1*   _斜體2_

效果:
粗體1 粗體2
斜體1 斜體2
注意:前后的*_與要加粗傾斜的字體之間不能有空格。

表格

表格應(yīng)該是Markdown比較累人的地方,語(yǔ)法真是操蛋!
|表示表格縱向邊界,表頭和表內(nèi)容用-隔開,并可用:進(jìn)行對(duì)齊設(shè)置,兩邊都有:則表示居中,若不加:則默認(rèn)左對(duì)齊。
詳細(xì)說明:

  • ----:為右對(duì)齊
  • :----為左對(duì)齊
  • :---:為居中對(duì)齊
  • -----為默認(rèn)左對(duì)齊

注意:-這樣的分隔符至少要有1個(gè)!目前測(cè)試是這樣的!
例1,

| 序號(hào) | 交易名 | 交易說明 | 備注 |
| ---: | :----: | :------- | ---- |
|   1  | prfcfg | 菜單配置 | 可以通過此交易查詢到所有交易碼和菜單的對(duì)應(yīng)關(guān)系 |
|   2  | gentmo | 編譯所有交易 |  |
|   100000  | sysdba | 數(shù)據(jù)庫(kù)表模型匯總 |  |

這種語(yǔ)法生成的表格如下:

序號(hào) 交易名 交易說明 備注
1 prfcfg 菜單配置 可以通過此交易查詢到所有交易碼和菜單的對(duì)應(yīng)關(guān)系
2 gentmo 編譯所有交易
100000 sysdba 數(shù)據(jù)庫(kù)表模型匯總

例2,

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned |\$1600 |
| col 2 is      | centered      |  \$12 |
| zebra stripes | are neat      |    $1 |

這種語(yǔ)法生成的表格如下:

Tables Are Cool
col 3 is right-aligned $1600
col 2 is centered $12
zebra stripes are neat $1

例3,

dog | bird | cat
----|------|----
foo | foo  | foo
bar | bar  | bar
baz | baz  | baz

這種語(yǔ)法生成的表格如下:

dog bird cat
foo foo foo
bar bar bar
baz baz baz

注意:最好還是和普通段落之間存在空行吧!雖然在Cmd Markdown中是不需要空一行的,但是在簡(jiǎn)書中測(cè)試就操蛋了。

分割線

分割線最常使用就是三個(gè)或以上*,還可以使用-_
例,

***

---

___

效果:




注意:

  1. 只要*或者-大于等于三個(gè)就可組成一條平行線。
  2. 使用---作為水平分割線時(shí),要在它的前后都空一行,防止---被當(dāng)成標(biāo)題標(biāo)記的表示方式。

反斜杠

使用\表示反斜杠,相當(dāng)于反轉(zhuǎn)義作用。在你不想顯示Markdown標(biāo)記時(shí)可以使用反斜杠。
Markdown支持的轉(zhuǎn)義字符列表:

\   反斜線
`   反引號(hào)
*   星號(hào)
_   底線
{}  花括號(hào)
[]  方括號(hào)
()  括弧
#   井字號(hào)
+   加號(hào)
-   減號(hào)
.   英文句點(diǎn)
!   驚嘆號(hào)

刪除線

使用~~表示刪除線。
例,

~~這是一條刪除線~~

效果:
這是一條刪除線
注意:~~和要添加刪除線的文字之間不能有空格。

注腳

使用[^footer1]表示注腳。
例,

這是一個(gè)注腳測(cè)試[^footer1]
[^footer1]: 這是一個(gè)測(cè)試,用來闡釋注腳。

效果:
這是一個(gè)注腳測(cè)試[1]

標(biāo)簽分類

使用標(biāo)簽:或者Tags:表示標(biāo)簽標(biāo)記。
例,

標(biāo)簽: 數(shù)學(xué) 英語(yǔ)
Tags: 數(shù)學(xué) 英語(yǔ)

效果(有個(gè)毛的效果):
標(biāo)簽: 數(shù)學(xué) 英語(yǔ)
Tags: 數(shù)學(xué) 英語(yǔ)
注意:

  1. 標(biāo)簽:或者Tags:中的冒號(hào)要使用半角冒號(hào)
  2. 基本沒使用過這個(gè)標(biāo)記,不過應(yīng)用場(chǎng)景應(yīng)該是歸類。便于快速了解文章分類。難道可以通過某種方式來遍歷到標(biāo)簽標(biāo)記?不甚了解。如你知道:請(qǐng)告訴我

錨點(diǎn)

錨點(diǎn)功能可參考Github(我還未玩,忽略)。在Githubmd 文件中,會(huì)為每個(gè)h1~h6標(biāo)簽,自動(dòng)塞入一個(gè)a標(biāo)簽,并渲染好id
例,

# h1

以上md語(yǔ)言被渲染成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)題為# html5,那么id就會(huì)是 user-content-html5。這樣就可以用類似下面的語(yǔ)句對(duì)其進(jìn)行跳轉(zhuǎn)定位:

[快點(diǎn)我,我要跳轉(zhuǎn)到h1所在的位置](#user-content-h1)

效果:一點(diǎn)擊快點(diǎn)我,我要跳轉(zhuǎn)到h1所在的位置,即跳轉(zhuǎn)到h1所在的位置。

我的參考如下:

  1. [Markdown,你只需要掌握這幾個(gè)][6]
  2. [markdown在博客園的使用][7]
  3. [怎樣使用Markdown][8]
  4. [Markdown 基本語(yǔ)法][9]
  5. [Markdown——入門指南][10]
  6. [Markdown入門指南][11]
  7. [Markdown語(yǔ)法說明(簡(jiǎn)體中文版)][12]
    [6]: http://www.cnblogs.com/crazyant007/p/4220066.html
    [7]: http://www.cnblogs.com/zichi/p/4788229.html
    [8]: http://www.ituring.com.cn/article/23
    [9]: https://github.com/younghz/Markdown
    [10]: http://www.lxweimin.com/p/1e402922ee32
    [11]: http://www.lxweimin.com/p/468f111d8fd3
    [12]: http://wowubuntu.com/markdown

  1. 這是一個(gè)測(cè)試,用來闡釋注腳。 ?

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 我們看到網(wǎng)上許多博客有著非常漂亮的排版,其實(shí)大部分都是用Markdown寫的,那Markdown究竟是什么呢? M...
    杰森_Jason閱讀 9,020評(píng)論 0 4
  • Markdown 優(yōu)點(diǎn)就是所寫即所得基本上就是為了懶癌的寫字黨提供書寫排版的方式渲染的效果不同的markdown工...
    阿飛不理飛閱讀 488評(píng)論 0 0
  • 最近搭建wiki時(shí),接觸到了Markdown的語(yǔ)法,體驗(yàn)到了它在html頁(yè)面上做富文本編輯的強(qiáng)大之處。因?yàn)橐膊怀J?..
    東方不亮sam閱讀 322評(píng)論 0 1
  • markdown是什么? 是一個(gè)簡(jiǎn)單的標(biāo)記語(yǔ)言,這些標(biāo)記和 html 的一些標(biāo)簽對(duì)應(yīng) 通過一些轉(zhuǎn)換庫(kù)可以把 mar...
    emily_gss閱讀 375評(píng)論 0 0
  • 標(biāo)題 標(biāo)題使用"#"來表示,幾級(jí)標(biāo)題就打幾個(gè)"#",例如: 一級(jí)標(biāo)題 二級(jí)標(biāo)題 三級(jí)標(biāo)題 四級(jí)標(biāo)題 五級(jí)標(biāo)題 列表...
    徐磊x閱讀 516評(píng)論 0 1