1. 程式人生 > >CSDN-MarkDown編輯器使用手冊(2)---MarkDown語法詳解

CSDN-MarkDown編輯器使用手冊(2)---MarkDown語法詳解

CSDN-MarkDown 之markdown語法詳解

1 MarkDown概述

設計哲學

MarkDown當初就是為了方便以純文字寫作而發明的,其設計宗旨是儘可能的易讀、易寫。其中易讀的重要性高於其他,要達到的目的就是讓讀者意識不到標記符號的存在。MarkDown並沒有設定最終顯示樣式的功能,只是規定了一篇文章的基本結構。所以同樣一篇使用MarkDown寫成的文章,在不同的網站上顯示效果可以完全不同。這也算是內容和樣式的分離,MarkDown只關注內容和結構,不關心最終顯示樣式。

與html的關係

MarkDown設計之初就是為了在Web上寫文章。但MarkDown絕不是為了取代html,也不是為了模仿html。實際上MarkDown的標籤功能只是HTML標籤功能的小小子集,這些標籤都是經過精挑細選出來的,只為了易讀易寫。

MarkDown最終要在Web上釋出,釋出之前必須轉換為html標籤,這個過程是有軟體完成的。從這個概念上說,MarkDown是書寫語言,而HTML是釋出語言。

在MarkDown檔案中,所有html標籤都可以直接使用,無需任何特殊處理,唯一限制是,html塊元素前後要空出一行,如:

這裡是一個段落。

<div>
    這裡的程式碼不會被MarkDown解析。如*好人*,並不會斜體顯示。
</div>

這裡是後續段落

與bbcode等的區別

除了MarkDown之外,還有很多用於Web書寫的標記語言,國內Discuzz論壇使用者都還記得其使用的BBcode吧。過去BBS、論壇、Blog也曾經設計開放HTML語法讓使用者使用,但卻衍生出語法輸入錯誤時造成整頁排版錯亂、有心人利用HTML語法進行XSS式的攻擊與破壞等問題。由於BBcode的轉換為系統機械式的行為,所以可以有效避免人為輸入錯誤的問題,而BBcode為預先設計好的語法,也就是說意圖以BBcode達成所有的HTML語法效果是不可能的,相當於一種語法過濾,如此便可避免所有可能發生的惡意破壞。

可見,BBCODE和MarkDown當初設計的出發點就是不同的。BBCODE更多是為了安全,而MarkDown是為了書寫創作,兩者可比性不強。

2 基本MarkDown語法

MarkDown是一種標準,所有實現都應該遵循一些基本的規範。

2.1 塊元素

段落和換行

什麼是段落,如何定界段落,是任何一個編輯器必須解決的問題。在微乳Word裡回車表示一個段落的開始,在HTML裡,<p></p>內封裝的文字是一個段落。在MarkDown裡,段落的分界標記是一個或者多個連續的空行。空行在這裡的含義是:看起來是空白的行,也就是說空行可以包含空格和Tab等看不見的字元。

換行,是另一個重要的概念。在Word裡,一個段落內的換行是根據樣式和紙張大小自動調整的;在HTML裡,除非使用<br />強制換行,否則一個<p>標記的段落內換行也是根據樣式自動調整的;而在純文字編輯器中,換行就是插入一個換行符。 MarkDown採用 【空格】【空格】【回車】 三個字元表示強制換行。

標題

MarkDown支援兩種標題語法形式。第一種如下所示。

這是一級標題
===========

這是二級標題
--------------

對於這種語法,很多的開源軟體Readme檔案在使用。= 和 - 的個數多少無所謂,至少有一個就行。如

這裡一級標題
=
這裡是二級標題
---------------------------------------------

需要注意的是,=和-必須從行首開始,前面不能有任何字元;後面也不能有其他字元。

這張語法格式,只能產生兩級標題,所以才引入了第二種語法格式。如下:

# 這是一級標題
## 這是二級標題
## 這是三級標題
#### 這是四級標題
##### 這是五級標題
###### 這是六級標題
####### 這還是六級標題,呵呵

前面有幾個連續的#就表示該行是第幾級標題,最多可以達到6級標題,分別與html的h1,h2,h3,h4,h5,h6相對應。

注意

(1)這兩種語法不能混用,請堅持使用其中第一種。如下面的情況:
# 這是標題一
==========================

(2)# 必須位於實際行首(之前不能有內容文字,但可以有MarkDown標籤),它和標題文字之間建議加【空格】。

引用

這種語法格式來自於Email。如下所示:

> 這裡是被引用文字的第一行  
> 這裡是被引用文字的第二行

其效果如下:

這裡是被引用文字的第一行
這裡是被引用文字的第二行

引用還可以巢狀。

> 這裡是第一級引用
> 
> > 這裡是第二級別引用
> 
> 又回到第一級別

引用裡面還可以使用其他MarkDown標籤,如:

> # 這裡是標題1
> 
> * 這裡是列表項
> * 這裡是列表項

列表

MarkDown與HTML一樣,同時支援有序列表和無序列表。無序列表如下所示:

中華人民共和國成立於哪一年?

* A 1949
* B 1921
* C 1804
* D 1956

使用非常簡單,這裡的*還可以換成-或者+號。 注意標籤符號和內容文字之間要有一個空格。

有序列表如下所示:

ToDo List:

1. 學習
2. 吃飯
3. 喝酒
4. 睡覺

語法格式為【數字】【點】【空格】, 注意這裡的數字是多少並不重要,轉換成html的時候,會自動重新賦值。但還是建議按標準的來寫。 每一個列表項可以包含多個段落,但是後續段落必須以4個空格或者一個Tab開頭

1.  This is a list item 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. Donec sit amet nisl. Aliquam semper ipsum
    sit amet velit.

2.  Suspendisse id sem consectetuer libero luctus adipiscing.

列表項中要包含引用,則引用的>必須被縮排。如下。

* 一個包含引用的列表項

    > 列表專案裡的引用

列表鄉里要包含程式碼塊,則必須以8個空格或者兩個Tab開始。如下。

* 一個包含程式碼塊的列表項

        這裡是列表內的程式碼塊

可見列表項裡的語法格式與普通語法格式是有所區別的。

程式碼塊

這個功能是為程式設計師特別設計的,用於在文章中嵌入程式原始碼。格式也很簡單,以至少4個空格或1個Tab開頭的文字就被認為是程式碼了。如下

    程式碼以至少4個空格或者1個Tab開頭
    這裡也是程式碼
這裡不是了

處於程式碼區域的html特殊字元會被自動轉義,Markdown語法在程式碼段裡不被解析。所以程式碼段可以用來直接輸出MarkDown自身原始碼。下面是一個C語言例子:

    int main()
    {
        printf("Hello C\n");
    }

水平線

水平線這樣表示。

* * *
***
---
--------------------------------------

不再解釋。

2.2 區間元素

超級連結

MarkDown支援兩種超級連結方式分別示意如下:

[百度](http://www.baidu.com)

[百度][1]
[1]: http://ww.baidu.com

強調

    *斜體*, **粗體**, ***粗斜體***

注意的事,*對稱分佈,且和內容文字之間不能有空格。

程式碼片段

這與塊元素的程式碼塊不同,程式碼片段允許載入在一個段落內。如:

使用`printf`函式列印結果。

使用printf函式列印結果。

如果要想在程式碼片段裡包含`,則需要使用多個`進行包圍。如。

``這裡面需要字面的反引號`,所以需要以多個反引號開始和結束。``

這是必要的,因為在程式碼段面,不能使用MarkDown語法,也就不能使用轉義了,只能通過這種特殊方式才能包含反引號。如果要想在開頭或者結尾使用字面的反引號呢?這需要把它和定界符的反引號組以空格分開。如。

`` `內容開頭是反引號的情況和內容結尾是反引號的情況。` ``

另外,程式碼片段可以跨越多行。如下。

`
這是第一行  
這是第二行
這裡還是程式碼片段
`

圖片

圖片語法就一句話: 在超級連結前面加上感嘆號。下面是例子:

![圖片](http://somewebsite/picname.png)

![圖片][tag]
[tag]: http://somewebsite/picname.png

2.3 雜項

自動生成連結

<http://example.com>會被自動轉轉換成<a href="http://example.com/">http://example.com/</a>

[email protected]會被自動轉換成

<a href="&#x6D;&#x61;i&#x6C;&#x74;&#x6F;:&#x61;&#x64;&#x64;&#x72;&#x65;
&#115;&#115;&#64;&#101;&#120;&#x61;&#109;&#x70;&#x6C;e&#x2E;&#99;&#111;
&#109;">&#x61;&#x64;&#x64;&#x72;&#x65;&#115;&#115;&#64;&#101;&#120;&#x61;
&#109;&#x70;&#x6C;e&#x2E;&#99;&#111;&#109;</a>

轉義

與任何標記語言一樣,必須對具有特殊意義的元字元進行轉義,才能得到其字面值。轉義標誌位反斜線。如

\*星號字面值\*

在有需要的地方盡情的轉義吧!

3 CSDN-MarkDown 擴充套件語法

CSDN-MarkDown在MarkDown基本語法的基礎上,擴充套件了很多實用的功能。

刪除線

~~這裡的內容有刪除線~~後續內容

這是個行內元素,以兩個連續的波浪線標誌開始和結束。

表格

    |學號|姓名|年齡|  
    |:---:|:---|---:|  
    |204|奧巴馬|18|

第一行是列標題,第二行定義各列對齊方式,第三列及其以後是各列的值。 上述程式碼得到的效果是:

學號 姓名 年齡
204 奧巴馬 18

程式碼柵欄

我個人覺得這是CSDN-MarkDown的特色所在,也是程式設計師部落格必備之物。

``` php
$name = $_GET['name'];
echo $name;
```

以【連續三個反引號】【可選空格】【可選語言型別】作為開始標記,以【連續三個反引號】作為結束標記,被包圍的內容會被特殊處理,使其顯示為語法高亮的html程式碼。上述程式碼顯示為:

$name = $_GET['name'];
echo $name;

4 幾個需要注意的問題

  1. 程式碼塊、列表、引用等塊元素,可以相互巢狀,語法格式與巢狀的順序有關。例如下面規則:

    *   程式碼塊作為列表項的子元素
    
        此時程式碼塊必須以至少2個Tab或8個空格開始。
    
            這是程式碼塊
    

    程式碼塊裡的東西只做html安全碼,不能識別處理MarkDown語法。所以程式碼塊裡也不可能出現列表。

    這裡是程式碼塊。
    * 這裡的MarkDown語法不被解釋。
    
  2. 列表項裡的後續段落需要以一個Tab或4個空格開始,其後面的語法規則就與正常無異了。

  3. 如果得不到想要的結果,加個空行或者空格試試,多動手,不要背誦語法規則。