blavince's BLOG

Giving is a reward in itself.

0%

Hexo 編輯文章常用 Markdown 基本語法


架設好個人部落格後, 開始撰寫文章!
Hexo 在編輯文章時支援 Markdown 語法, 所以在這裡列出常用的語法.

哲學
Markdown 的目標是實現「易讀易寫」。 ( 參考: Markdown )

標題

使用 # 來表示等級一的標題,總共有六個等級,且 # 字符號和文字間要空一格。語法依此類推:

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

文字字體

類別 語法 顯示結果
粗體 **我是粗體** 我是粗體
斜體 *我是斜體* 我是斜體
粗斜體 ***我是粗斜體*** 我是粗斜體
刪除線 ~~我是刪除線~~ 我是刪除線
底線 <u>我是底線<u> 我是底線

文字顏色

Markdown 並沒有更改文字顏色的語法, 因此只能我們靠自己加入 HTML 語法來修改文字顏色, 例如 <font color=#008000>我是深綠色</font> : 我是深綠色,
除了以下列出的顏色, 也可以到 常用顏色表 自行查詢顏色。

語法 顯示結果 語法 顯示結果
<font color=#800000>酒紅色</font> 酒紅色 <font color=#FF0000>紅色</font> 紅色
<font color=#FF6600>橘色</font> 橘色 <font color=#FFD700>金色</font> 金色
<font color=#FFFF00>黃色</font> 黃色 <font color=#00FF00>綠色</font> 綠色
<font color=#008000>墨綠色</font> 墨綠色 <font color=#00FFFF>青色</font> 青色
<font color=#0000FF>深藍色</font> 深藍色 <font color=#FF00FF>粉紅色</font> 粉紅色
<font color=#800080>紫色</font> 紫色 <font color=#808080>灰色</font> 灰色

程式碼

  • 文字間程式碼
    使用 1 個反引號包起來:
1
執行 `blavince()` 函式

結果如下:
執行 blavince() 函式

  • 段落程式碼
    使用 3 個反引號包起來:

顯示結果如下:

1
2
3
4
5
6
7
// HelloWorld 程式
#include <stdio.h>

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

分隔線

一整列中輸入三個以上的 *** 或三個以上的 ---,且整列不能有其它文字,結果顯示如下:


項目符號/編號

可使用 +1.縮排 或者 階層式, 但要記得在符號與內文加一個空格

1
2
3
4
5
6
7
8
9
10
1. 數字
2. 縮排
+ How
+ Are
+ you
3. 代辦事項
- [x] 電腦
- [ ] I/O
- [x] 滑鼠
- [ ] 鍵盤
  1. 數字
  2. 縮排
    • How
    • are
    • you
  3. 代辦事項
  • 電腦
  • I/O
    • 滑鼠
    • 鍵盤

箭頭

符號 解釋 代碼
左箭頭 &larr;
右箭頭 &rarr;
上箭頭 &uarr;
下箭頭 &darr;
水平箭頭 &harr;
豎直箭頭 &varr;
雙線左箭頭 &lArr;
雙線右箭頭 &rArr;
雙線上箭頭 &uArr;
雙線上箭頭 &dArr;
雙線水平雙箭頭 &hArr;
雙線豎直箭頭 &vArr;

引用區塊

使用 > 放在整列的開頭當作引用區塊,且 > 和文字間要空一格,語法範例如下:

1
2
> 東風夜放花千樹,更吹落、星如雨。寶馬雕車香滿路。鳳簫聲動,玉壺光轉,一夜魚龍舞。
> 蛾兒雪柳黃金縷,笑語盈盈暗香去。眾裡尋他千百度,驀然回首,那人卻在,燈火闌珊處。

東風夜放花千樹,更吹落、星如雨。寶馬雕車香滿路。鳳簫聲動,玉壺光轉,一夜魚龍舞。
蛾兒雪柳黃金縷,笑語盈盈暗香去。眾裡尋他千百度,驀然回首,那人卻在,燈火闌珊處。

同時也支持階層式

1
2
3
4
> 東風夜放花千樹,更吹落、星如雨。寶馬雕車香滿路。
> > 鳳簫聲動,玉壺光轉,一夜魚龍舞。
> > > 蛾兒雪柳黃金縷,笑語盈盈暗香去。
> > > > 眾裡尋他千百度,驀然回首,那人卻在,燈火闌珊處。

東風夜放花千樹,更吹落、星如雨。寶馬雕車香滿路。

鳳簫聲動,玉壺光轉,一夜魚龍舞。

蛾兒雪柳黃金縷,笑語盈盈暗香去。

眾裡尋他千百度,驀然回首,那人卻在,燈火闌珊處。

超連結

  • 文字超連結

    1
    [Google](https://www.google.com.tw/)

    Google

  • 圖片超連結
    差別在於前面加入驚嘆號 ![Google]

    1
    ![Google](https://www.google.com.tw/images/branding/googlelogo/2x/googlelogo_color_160x56dp.png)

    Google

表格

表格的基本語法如下,
第一列是表格的標題列,
第二列固定要是以 --- 做區隔,加欄位都是使用 | 來添加。
注意表格的每欄寬度會自動分配,所以可以忽略一切的空格(也就是每列的 | 沒有對齊也沒關係,且加多少空格也不會影響每欄的寬度)。

而每欄可以決定要如何對齊,對齊方式取決於第二列的 ---,再加上 : 符號:

  • :--- 靠左對齊。
  • ---: 靠右對齊。
  • :---: 置中對齊。
1
2
3
4
5
| 預設對齊 | 靠左對齊 | 靠右對齊 | 置中對齊 |
| ----- | :----- | -----: | :-----: |
| Text1 | Text2 | Text3 | Text4 |
| Text5 | Text6 | Text7 | Text8 |
| Text9 | Text10 | Text11 | Text12 |

顯示如下:

預設對齊 靠左對齊 靠右對齊 置中對齊
Text1 Text2 Text3 Text4
Text5 Text6 Text7 Text8
Text9 Text10 Text11 Text12

引用文章: 瑪利歐的部落格