學會 Markdown 開始寫部落格吧!

第一篇當然要寫 Markdown 啊!不然怎麼寫部落格?

什麼是 Markdown ?

Markdown 是一種輕量化的標記語言(lightweight markup language),檔案格式為 .md,它撰寫容易,易讀性也高,能幫助作者更專注於寫作,被泛用在 Blog 或 text format,甚至被拿來撰寫電子書。常見的網站如 GitHub 或 Wordpress 都能夠用 Markdown 來撰寫文件。

更多基本介紹請見 Wikipedia

Markdown


基本格式簡介

標題

1
2
3
4
5
6
用 # 加在標題文字前,例如 ###### 表示 H6 

# This is heading1
## This is heading 2
...
###### This is heading 6

This is heading 1

This is heading 2

This is heading 6

文體

1
2
3
4
5
6
7
斜體;用 * 或 _ 將文字包起來,例如:*斜體* 或 _J個也是斜體_

粗體;用 ** 把文字包起來,例如:**粗粗的粗體**

刪除:用 ~~ ~~ 把不是重點的文字刪掉! 例如: ~~ 那幹嘛寫啊? ~~

斜體+粗體? ***當然沒有問題!***

斜體:斜體J個也是斜體

粗體:粗粗的粗體

刪除:那幹嘛寫啊?

斜體+粗體? 當然沒有問題!


列點

1
2
3
4
5
6
7
8
9
10
11
1. 這是有序列點第 1 點
2. 這是有序列點第 2 點
1. 列點下再縮排一個 TAB 就會變成巢狀列點囉!
2. 其實前面用什麼數字都沒關係,只要是數字就好。

無序列點可以用 * 或 + 或 - 來點示:
* 無序列點第 1 點
+ 無序列點第 2 點
- 當然 TAB 縮排成巢狀也沒問題!
- 如果要斷行的話要在後面加上兩個空白喔
這行其實已經斷行了,但還是在同一個列點段落中。

  1. 這是有序列點第 1 點
  2. 這是有序列點第 2 點
    1. 列點下再縮排一個 TAB就會變成巢狀列點囉!(看起來很有條理?)
    2. 其實前面用什麼數字都沒關係,只要是數字就好。

無序列點可以用 * 或 + 或 - 來表示:

  • 無序列點第 1 點
  • 無序列點第 2 點
    • 當然 TAB 縮排成巢狀也沒問題!
    • 如果要斷行的話要在後面加上兩個空白喔
      這行其實已經斷行了,但還是在同一個列點段落中。

引述

1
2
3
4
5
6
> 開頭加上 > 就是引述囉!
> 只要開頭加上 > 的地方都是引述

> 如果這一整段很長的話,只要開頭有一個 > ,都會是引述範圍哦!對了,引述裡面**當然可以**運用其他 *文體* 語法的。
>> 這樣就變成巢狀引述了!
>>> 不知道可以有幾層?

開頭加上 > 就是引述囉!
只要開頭加上 > 的地方都是引述

如果這一整段很長的話,只要開頭有一個 >,都會是引述範圍哦!對了,引述裡面當然可以運用其他 文體 語法的。

這樣就變成巢狀引述了!

不知道可以有幾層?


連結

1
[連結文字](連結網址 "標題文字")

如果你想貼上一個超連結,就用下面這個 ↓
W3School

如果你想貼上一個假連結,那 ( ) 裡面就不要放連結。
你點看看阿 → 會停留在原本的頁面


圖片

1
![Alt 文字](圖片連結 "標題文字")

Alt Markdown LOGO

滑鼠移到圖片上會顯示標題文字!


YouTube 影片

1
2
3
4
5
6
7
8
9
用連結圖片的方式連結影片 ↓
[![Alt 文字](http://img.youtube.com/vi/YOUTUBE影片ID放在這裡/0.jpg)](http://www.youtube.com/watch?v=YOUTUBE影片ID放在這裡)

但上述方式無法設定圖片邊框與大小

用行內 HTML 來連結影片,並設定圖片大小 ↓
<a href="http://www.youtube.com/watch?feature=player_embedded&v=YOUTUBE影片ID放在這裡
" target="_blank"><img src="http://img.youtube.com/vi/YOUTUBE影片ID放在這裡/0.jpg"
alt="圖片 ALT 文字放在這裡" width="240" height="180" border="10" /></a>

alt 文字

點一下圖片就能夠連到影片網頁(Hexo 似乎不支援隨點隨放?)


程式碼

1
2
行內程式碼 ` <div>歡迎來到Fei的技術部落</div> ` ,就用反引號包起來。
程式碼區塊可以用 3 個反引號來圍住,在反引號後面接上語言名稱,可使語法高亮!

行內程式碼 <div>歡迎來到Fei的技術部落</div> ,就用反引號包起來。

1
2
3
4
5
6
7
8
9
// 以 JavaScript 為例:

var greet = function(say){
greeting = say || 'Hello!!'
return function(name){
console.log(greeting + ' ' + name + '.') ;
}
}
greet()('Fei') ;

不是所有程式語言都支援語法高量哦!


參考資料

Weird-JavaScript 01:語法解析、詞彙環境、執行脈絡

評論

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×