GitHub上README.md教程

標籤：

轉自:http://blog.csdn.net/kaitiren/article/details/38513715#t0

最近對它的README.md檔案頗為感興趣。便寫下這貼，協助更多的還不會編寫README檔案的同學們。

README檔案尾碼名為md。md是markdown的縮寫，markdown是一種編輯部落格的語言。用慣了可視化的部落格編輯器（比如CSDN部落格，囧），這種編程式的部落格編輯方案著實讓人眼前一亮。不過GitHub支援的文法在標準markdown文法的基礎上做了修改，稱為Github Flavored Markdown，簡稱GFM。可不是GFW呀。

————————————————————————————

我在GitHub上為本文建的一個倉庫“test”，供大家查看代碼即具體效果：https://github.com/guodongxiaren/test 

本倉庫README檔案持續更新，新的知識點可能不會更新到博文中。首先強烈建議一條，不要用360或搜狗瀏覽器訪問GitHub網站，你會發現此時網站上很多按鈕都不可用。。建議使用Firefox或Google瀏覽器訪問GitHub

————————————————————————————

開始編輯README

開啟你的GitHub的某個項目，我們可以直接線上編輯你的README檔案，如果你已經有了這個檔案，則在檔案目錄中直接點擊它，如果你還沒有這個檔案那麼點擊項目名稱右邊的一個按鈕，來添加新檔案：

然後你就開啟了編輯頁面，編輯區的左上方有填寫檔案名稱的地區，注意加上尾碼.md

如果你本來就有這個檔案要重新編輯它的話，那麼在點擊了檔案目錄中的該檔案後，在上方有工具列，選擇Edit

然後滾動螢幕到下面，如果是新檔案會有一個Commit new file的按鈕，若沒有內容是不能點擊的。如果是舊檔案重修編輯，那麼這個按鈕顯示的是 Commit changes

//順便吐槽一句如果是360或搜狗瀏覽器的話，這個按鈕是永遠都無法點擊的，囧。。

先隨便寫的東西把這個新檔案提交，然後再點擊 Edit 重新開啟它。你會發現編輯區左上方有了變化。

預設選中Code，即我們的編輯模式。若點擊 Preview（預覽）就能即時顯示當前的顯示效果了。

好了，下面正式開始編輯這個檔案

 

關於標題

規範的README檔案開頭都寫上一個標題，這被稱為大標題。

[plain] view plaincopy

1. 大標題  
2. ====  

在文本下面加上 等號 = ，那麼上方的文本就變成了大標題。等號的個數無限制，但一定要大於0個哦。。

比大標題低一級的是中標題，也就是顯示出來比大標題小點。

[plain] view plaincopy

1. 中標題  
2. -------  

在文本下面加上 底線 - ，那麼上方的文本就變成了中標題，同樣的 底線個數無限制。

除此之外，你也會發現大，中標題下面都有一條橫線，沒錯這就是 = 和 - 的顯示結果。

如果你只輸入了等號=，但其上方無文字，那麼就只會顯示一條直線。如果上方有了文字，但你又只想顯示一條橫線，而不想把上方的文字轉義成大標題的話，那麼你就要在等號=和文字直接補一個空行。

補空行：是很常用的用法，當你不想上下兩個不同的布局方式交錯到一起的時候，就要在兩種布局之間補一個空行。

如果你只輸入了虛線（減號）-，其上方無文字，那麼要顯示直線，必須要寫三個減號以上。不過與等號的顯示效果不同，它顯示出來時虛線而不是實線。同減號作用相同的還有星號*和底線_，同樣的這兩者符號也要寫三個以上才能顯示一條虛橫線。

除此以外，關於標題還有等級標記法，分為六個等級，顯示的文字大小依次減小。不同等級之間是以井號  #  的個數來標識的。一級標題有一個 #，二級標題有兩個# ，以此類推。

[plain] view plaincopy

1. #一級標題  
2. ##二級標題  
3. ###三級標題  
4. ####四級標題  
5. #####五級標題  
6. ######六級標題  

注意井號#和標題名稱要並排寫作一行，顯示效果

實際上，前文所述的大標題和中標題是分別和一級標題和二級標題對應的。即大標題大小和一級標題相同，中標題大小和二級標題相同。

顯示文本

 

普通文本

直接輸入的文字就是普通文本。需要注意的是要換行的時候不能直接通過斷行符號來換行，需要使用<br>(或者<br/>)。也就是html裡面的標籤。事實上，markdown支援一些html標籤，你可以試試。當然如果你完全使用html來寫的話，就喪失意義了，畢竟markdown並非專門做前端的，然而僅實現一般效果的話，它會比html寫起來要簡潔得多得多啦。

[plain] view plaincopy

1. 這是一段普通的文本，  
2. 直接斷行符號不能換行，<br>  
3. 要使用\<br>  

注意第三行的<br>前加了反斜線 \ 。目的就是像其他語言那樣實現轉義，也就是 <  的轉義。

效果

此外，要顯示一個超連結的話，就直接輸入這個連結的URL就好了。顯示出來會自動變成可連結的形式的。

顯示空格的小Tip預設的文本行首空格都會被忽略的，但是如果你想用空格來排一下版的話怎麼辦呢，有個小技巧，那就是把你的IME由半形改成全形就OK啦。單行文本

使用兩個Tab符實現單行文本。

[plain] view plaincopy

1. Hello,大家好，我是果凍蝦仁。  

注意前面有兩個Tab。在GitHub上單行文本顯示效果

多行文本

多行文本和單行文本異曲同工，只要在每行行首加兩個Tab

[plain] view plaincopy

1. 歡迎到訪  
2. 很高興見到您  
3. 祝您，早上好，中午好，下午好，晚安  

 

部分文字的高亮

如果你想使一段話中部分文字高亮顯示，來起到突出強調的作用，那麼可以把它用 `  ` 包圍起來。注意這不是單引號，而是Tab上方，數字1左邊的按鍵（注意使用英文IME）。

Thank `You` . Please `Call` Me `Coder`

文字超連結

給一段文字加入超連結的格式是這樣的 [ 要顯示的文字 ]( 連結的地址 )。比如：

[plain] view plaincopy

1. [我的部落格](http://blog.csdn.net/guodongxiaren)  

顯示效果：

你還可以給他加上一個滑鼠移至上方顯示的文本。

[plain] view plaincopy

1. [我的部落格](http://blog.csdn.net/guodongxiaren "懸停顯示")  

即在URL之後 用雙引號括起來一個字串。同樣要注意這裡是英文雙引號。

 

插入符號圓點符

• 這是一個圓點符
• 這也是一個圓點符

上面這段的圓點是CSDN部落格編輯器裡面的符號列表。寫文章在列出條目時經常用到。在GitHub的markdown文法裡也支援使用圓點符。編輯的時候使用的是星號 *

[plain] view plaincopy

1. * 暱稱：果凍蝦仁  
2. * 別名：隔壁老王  
3. * 英文名：Jelly  

要注意的是星號* 後面要有一個空格。否則顯示為普通星號。上文的顯示效果

此外還有二級圓點和三級圓點。就是多加一個Tab。

[plain] view plaincopy

1. * 程式設計語言  
2.     * 指令碼語言  
3.         * Python  

第二行一個Tab，第三行兩個Tab。這樣用來展示層級結構就更清晰了吧，看效果：

如果你覺得三級的結構還不夠表達清楚的話，我們可以試著換一種形式，請看字元包圍

 

縮排

縮排的含義是很容易理解的。。

[plain] view plaincopy

1. >資料結構  
2. >>樹  
3. >>>二叉樹  
4. >>>>平衡二叉樹  
5. >>>>>滿二叉樹  

顯示效果：

當然比這個更一般的用法是這樣。常常能在書籍裡面看到的效果，比如引用別人的文章。直接看效果。

 

具體這個“縮排”的用法。大家自己摸索吧。

插入圖片

 

來源於網路的圖片

 

網上有很多README插入圖片的教程了，經我自己多次測試呢，發現可以使用的最簡單，最基本的文法是：

[plain] view plaincopy

1.   

即 歎號! + 方括弧[ ] + 括弧( ) 其中歎號裡是圖片的URL。

如果不加歎號! ,就會變成普通文本baidu了。

在方括弧裡可以加入一些 標識性的資訊，比如

[plain] view plaincopy

1.   

這個方括弧裡的baidu並不會對映像顯示造成任何改動，如果你想達到滑鼠移至上方顯示提示資訊，那麼可以仿照前面介紹的文本中的方法，就是這樣：

[plain] view plaincopy

1.   

在URL後面，加一個雙引號包圍的字串，顯示效果

 

GitHub倉庫裡的圖片

有時候我們想顯示一個GitHub倉庫(或者說項目)裡的圖片而不是一張其他來源網狀圖片，因為其他來源的URL很可能會失效。那麼如何顯示一個GitHub項目裡的圖片呢？

其實與上面的格式基本一致的，所不同的就是括弧裡的URL該怎麼寫。

    https://github.com/ 你的使用者名稱 / 你的項目名 / raw / 分支名 / 存放圖片的檔案夾 / 該檔案夾下的圖片

這樣一目瞭然了吧。比如：

[plain] view plaincopy

1.   

我在GitHub上的使用者名稱guodongxiaren；有一個項目ImageCache；raw表示原資料的意思吧，不用管它；主分支master；項目裡有一個檔案夾Logo；Logo檔案夾下有一張圖片foryou.gif

 

給圖片加上超連結

如果你想使圖片帶有超連結的功能，即點擊一個圖片進入一個指定的網頁。那麼可以這樣寫：

[plain] view plaincopy

1. [![baidu]](http://baidu.com)  
2. [baidu]:http://www.baidu.com/img/bdlogo.gif "百度Logo"  

這兩句和前面的寫法差異較大，但是也極易模仿著寫出，就不過多介紹了。只需注意上下文中的 baidu 是你自己起的標識的名稱，可以隨意，但是一定要保證上下兩行的 標識 是一致的。

這樣就能實現 點擊圖片進入網頁的功能了。

插入程式碼片段

我們需要在代碼的上一行和下一行用` `` 標記。``` 不是三個單引號，而是數字1左邊，Tab鍵上面的鍵。要實現文法高亮那麼只要在 ``` 之後加上你的程式設計語言即可（忽略大小寫）。c++語言可以寫成c++也可以是cpp。看代碼：

實際顯示效果

[題外話]在GitHub上用Gist寫日記吧

看了這麼多markdown的文法，你一定不滿足於僅僅寫一個README檔案了，開始躍躍欲試想實際用markdown文法來編寫部落格或文章了吧。的確，網上也有依託或者支援markdown文法的部落格。但是呢，更方便的是，你可以藉助GitHub本身就有的一個功能——Gist。

Gist是以檔案為單位的，不是以項目為單位的。而且與普通的GitHub上建的倉庫不同，Gist是private的哦。普通的項目預設都是public的，要想弄成private貌似還要交錢的樣子。既然是private那麼用來寫寫日記，是極好的。

GitHub網頁的頂部有：

點進去:

這就是你可以編輯的私人檔案，它不僅支援Text文本，還支援各種程式設計語言呢！當然也包括markdown。輸入檔案名稱：

最後儲存，選中 Create Secret Gist 就是私人的嘍。

我在GitHub上為本文建的一個項目，供大家查看代碼即具體效果：https://github.com/guodongxiaren/test

GitHub上README.md教程