Markdown語法圖文全面詳解

目錄

 

前言 
寫過博客或者github上面的文檔的,應該知道Markdown語法的重要性,不知道的朋友們也彆着急,一篇博客輕鬆搞定Markdown語法。話說這個語法超級簡單,一看就會,不信你點進來看看。

1. 快捷鍵

跳轉到目錄

功能 快捷鍵
加粗 Ctrl + B
斜體 Ctrl + I
引用 Ctrl + Q
插入鏈接 Ctrl + L
插入代碼 Ctrl + K
插入圖片 Ctrl + G
提升標題 Ctrl + H
有序列表 Ctrl + O
無序列表 Ctrl + U
橫線 Ctrl + R
撤銷 Ctrl + Z
重做 Ctrl + Y

2. 基本語法

跳轉到目錄

2.1 字體設置斜體、粗體、刪除線

*這裏是文字*
_這裏是文字_
**這裏是文字**
***這裏是文字***
~~這裏是文字~~

這裏寫圖片描述

2.2 分級標題

跳轉到目錄 
寫法1:

# 一級標題## 二級標題### 三級標題#### 四級標題##### 五級標題###### 六級標題  這個寫法和 **文字**效果是一樣的

這裏寫圖片描述

寫法2: 

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

或者

二級標題
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 


這裏寫圖片描述

 

2.3 鏈接

跳轉到目錄 
(1)插入本地圖片鏈接 
語法規則,有兩種寫法: 
這裏寫圖片描述 
注意:這個圖片描述可以不寫。

示例圖如下: 
這裏寫圖片描述

(2)插入互聯網上圖片 
語法規則: 
這裏寫圖片描述 
注意:這個圖片描述可以不寫。

示例如下: 
這裏寫圖片描述 
(3)自動連接 
Markdown 支持以比較簡短的自動鏈接形式來處理網址和電子郵件信箱,只要是用<>包起來, Markdown 就會自動把它轉成鏈接。也可以直接寫,也是可以顯示成鏈接形式的 
例如: 
這裏寫圖片描述

2.4 分割線

跳轉到目錄 
你可以在一行中用三個以上的星號(*)、減號(-)、底線(_)來建立一個分隔線,行內不能有其他東西。你也可以在星號或是減號中間插入空格。 
這裏寫圖片描述

2.5 代碼塊

跳轉到目錄 
對於程序員來說這個功能是必不可少的,插入程序代碼的方式有兩種,一種是利用縮進(tab), 另一種是利用英文“`”符號(一般在ESC鍵下方,和~同一個鍵)包裹代碼。

(1)代碼塊:縮進 4 個空格或是 1 個製表符。效果如下: 
這裏寫圖片描述 
(2)行內式:如果在一個行內需要引用代碼,只要用反引號`引起來就好(一般在ESC鍵下方,和~同一個鍵) 
這裏寫圖片描述

(3)多行代碼塊與語法高亮:在需要高亮的代碼塊的前一行及後一行使用三個單反引號“`”包裹,就可以了。 
示例如下: 
這裏寫圖片描述

(4)代碼塊裏面包含html代碼 
在代碼區塊裏面, & 、 < 和 > 會自動轉成 HTML 實體,這樣的方式讓你非常容易使用 Markdown 插入範例用的 HTML 原始碼,只需要複製貼上,剩下的 Markdown 都會幫你處理。

注意:簡書代碼塊裏不支持html。

示例如下: 
這裏寫圖片描述

2.6 引用

跳轉到目錄 
在被引用的文本前加上>符號,以及一個空格就可以了,如果只輸入了一個>符號會產生一個空白的引用。

(1)基本使用 
使用如下圖所示: 
這裏寫圖片描述

(2)引用的嵌套使用 
使用如圖所示: 
這裏寫圖片描述 
(3)引用其它要素 
引用的區塊內也可以使用其他的 Markdown 語法,包括標題、列表、代碼區塊等。 
使用如圖所示: 
這裏寫圖片描述

2.7 列表

跳轉到目錄 
(1)無序列表 
使用 *,+,- 表示無序列表。 
注意:符號後面一定要有一個空格,起到縮進的作用。 
這裏寫圖片描述

(2)有序列表 
使用數字和一個英文句點表示有序列表。 
注意:英文句點後面一定要有一個空格,起到縮進的作用。 
這裏寫圖片描述

(3)無序列表和有序列表同時使用 
這裏寫圖片描述

(4)列表和其它要素混合使用 
列表不光可以單獨使用,也可以使用其他的 Markdown 語法,包括標題、引用、代碼區塊等。

注意事項:

(1)加粗效果不能直接用於列表標題裏面,但是可以嵌套在列表裏面混合使用。 
(2)列表中包含代碼塊(前面加2個tab或者8個空格,並且需要空一行,否則不顯示)。 

使用示例如下圖: 
這裏寫圖片描述

(5)注意事項 
在使用列表時,只要是數字後面加上英文的點,就會無意間產生列表,比如2017.12.30 這時候想表達的是日期,有些軟件把它被誤認爲是列表。解決方式:在每個點前面加上\就可以了。如下圖所示: 
這裏寫圖片描述

2.8 表格

跳轉到目錄 
表格的基本寫法很簡單,就跟表格的形狀很相似: 
這裏寫圖片描述

表格對齊方式:我們可以指定表格單元格的對齊方式,冒號在左邊表示左對齊,右邊表示有對齊,兩邊都有表示居中。

如下圖所示: 
這裏寫圖片描述

3. 常用技巧

3.1 換行

方法1: 連續兩個以上空格+回車 
方法2:使用html語言換行標籤:

3.2 縮進字符

不斷行的空白格   或  半角的空格   或  全角的空格   或   
這裏寫圖片描述

3.3 特殊符號

(1)對於 Markdown 中的語法符號,前面加反斜線\即可顯示符號本身。

示例如下: 
這裏寫圖片描述

(2)其他特殊字符,示例如下: 
這裏寫圖片描述 
想知道字符對應的Unicode碼,可以看這個網站:https://unicode-table.com/cn/

附上幾個工具對特殊字符的支持的對比圖: 
這裏寫圖片描述

3.4 字體、字號與顏色

Markdown是一種可以使用普通文本編輯器編寫的標記語言,通過類似HTML的標記語法,它可以使普通文本內容具有一定的格式。但是它本身是不支持修改字體、字號與顏色等功能的!

CSDN-markdown編輯器是其衍生版本,擴展了Markdown的功能(如表格、腳註、內嵌HTML等等)!對,就是內嵌HTML,接下來要講的功能就需要使用內嵌HTML的方法來實現。

字體,字號和顏色編輯如下代碼 
這裏寫圖片描述

具體顏色分類及標記請看下錶: 
這裏寫圖片描述

3.5 鏈接的高級操作

鏈接的高級操作(這個需要掌握一下,很有用)

1.行內式

這個在上文第二條基本語法的 鏈接這個小節已經過,這裏就不繼續講解了。

2.參考式鏈接

在文檔要插入圖片的地方寫![圖片或網址鏈接][標記],在文檔的最後寫上[標記]:圖片地址 “標題”。(最後這個”標題”可以不填寫)

示例如下: 
這裏寫圖片描述

3.內容目錄

在段落中填寫 [TOC] 以顯示全文內容的目錄結構。

4.錨點

錨點其實就是頁內超鏈接。比如我這裏寫下一個錨點,點擊回到目錄,就能跳轉到目錄。 在目錄中點擊這一節,就能跳過來。

注意:在簡書中使用錨點時,點擊會打開一個新的當前頁面,雖然錨點用的不是很舒服,但是可以用註腳實現這個功能。

語法說明: 
在你準備跳轉到的指定標題後插入錨點{#標記},然後在文檔的其它地方寫上連接到錨點的鏈接。

使用如下圖所示: 
這裏寫圖片描述

5.註腳

語法說明: 
在需要添加註腳的文字後加上腳註名字[^註腳名字],稱爲加註。 然後在文本的任意位置(一般在最後)添加腳註,腳註前必須有對應的腳註名字。

示例如下: 
這裏寫圖片描述 
注:

  1. 腳註自動被搬運到最後面,請到文章末尾查看,並且腳註後方的鏈接可以直接跳轉回到加註的地方。
  2. 由於簡書不支持錨點,所以可以用註腳實現頁面內部的跳轉。

3.6 背景色

Markdown本身不支持背景色設置,需要採用內置html的方式實現:藉助 table, tr, td 等表格標籤的 bgcolor 屬性來實現背景色的功能。舉例如下:

<table><tr><td bgcolor=orange>背景色是:orange</td></tr></table>

這裏寫圖片描述

3.7 emoji表情符號

emoji表情使用:EMOJICODE:的格式,詳細列表可見 
https://www.webpagefx.com/tools/emoji-cheat-sheet/

當然現在很多markdown工具或者網站都不支持。

下面列出幾個平臺的對比:

工具或網站 是否支持emoji表情符號
簡書
MarkDownPad 否(不知道付費版是否支持)
有道雲筆記
zybuluo.com
github

這裏寫圖片描述

4. 高端用法

4.1 Latex數學公式

使用LaTex數學公式

1.行內公式:使用兩個”$”符號引用公式:

$公式$

2.行間公式:使用兩對“$$”符號引用公式:

$$公式$$

輸入$\sqrt{x^{2}}$ 
顯示結果是x2−−√x2

具體可以參考 markdown編輯器使用LaTex數學公式(https://link.jianshu.com/?t=http%3A%2F%2Fblog.csdn.net%2Ftestcs_dn%2Farticle%2Fdetails%2F44229085

latex數學符號詳見:常用數學符號的 LaTeX 表示方法

4.2 流程圖

這裏簡單介紹一下流程圖的語法,僅作爲了解,如下圖所示: 
這裏寫圖片描述

4.3 製作一份待辦事宜—-Todo 列表

這裏寫圖片描述

4.4 繪製 序列圖

這裏寫圖片描述

4.5 繪製 甘特圖

這裏寫圖片描述

5. Markdown工具

1.markdownpad軟件,就是利用markdown語言寫筆記的。官網下載地址:http://markdownpad.com/

軟件安裝之後的示意圖如下圖所示: 
這裏寫圖片描述

2.有道雲筆記支持markdownpad語法。官方網址:http://note.youdao.com/ 它有在線網頁版以及PC端可以下載。當然有道雲筆記也支持html語法。

網頁版使用markdown示例圖如下: 
這裏寫圖片描述

3.在線編輯markdown https://www.zybuluo.com/mdeditor

本文參考文章:

http://blog.csdn.net/u010177286/article/details/50358720

https://www.zybuluo.com/mdeditor

http://blog.leanote.com/post/freewalk/Markdown-%E8%AF%AD%E6%B3%95%E6%89%8B%E5%86%8C#title-18

發佈了66 篇原創文章 · 獲贊 81 · 訪問量 58萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章