標籤

2017年1月7日 星期六

Markdown Syntax

markdown

Markdown語法

概述

因為要使用Markdown來寫文章,第一篇就先來記錄一下的用法。

Markdown透過簡單的標籤語法,就能提供一個易讀的介面。Markdown線上的文件有很多,我主要是看 markdown.tw 學習,其實就是原作者提供資料的網站中文版。

這篇內容主要是要知道用法,也就不特別把呈現效果展示,不過雖話說如此,其實此篇就會用到許多項目,即可參考展示內容。

在windows及OSX兩個平台中,我是用MarkdownPad2與MacDown做編輯的動作,這兩個都可以即時預覽,目前用起來MacDown使用上功能較為齊全,因為MarkdownPad2有些功能要付費才能使用。

基本

標題

有幾種寫法可以使用,但要像這篇能加入header的id還是需要透過html的方式加入。

# H1
## H2
### H3
#### H4
##### H5
###### H6

H1
======

H2
------

<h3 id="header">標題</h3>

換行

在一段的結尾按下Tab或幾個空白(官方說2個以上)應該就會有。

引言

Markdown的引言使用>為標籤,引言也可以在包引言或是其他如強調等的語法

>我愛引言
>
>>引言愛我
>
>**引言中包強調語法**

清單

Markdown 支援兩種清單:

  1. 無序清單
  2. 有序清單

無序使用星(*)、加(+)、減(-)號為標籤,可以混用。

* 547
+ 548
- 549

也可以讓它有階層

*   8+9=17
    *   70+17=87
    *   1024*768
*   10

有序清單則使用數字接著一個英文句點,數字不用照順序也沒問題,最後都會照順序處理,但最好還是從1開始。

1.  有序清單
2.  無序清單

而清單要注意的是裡面要包含引言或程式碼區塊,就要再使用縮排,引言縮排一次,程式碼區塊兩次。

*   清單包引言及程式碼:

    > 我愛引言
    > 引言愛我

        <程式碼位置>

程式碼區塊

Markdown 中建立程式碼區塊只要靠著一次縮排(1Tab or 4空白)即可出現,而整個區塊會包含到下一個沒有縮排的那一行。

區塊中 &<> 會自動轉成 HTML 實體,不用特定轉換。

一般解釋解釋區段:

    <程式碼位置>

<div class="copy">
        &copy; GG Corporation
</div>

分隔線

在一行中用三個或以上的星號、減號、底線來建立一個分隔線(中間可有空白)。下面每種寫法都可以建立分隔線:

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

Markdown 有行內參考兩種形式,連結的文字都是用 [方括號] 來標記,路徑可包含相對路徑。

行內形式

[kakapon的部落格](https://kakapontw.blogspot.tw/) 空空如也.

[kakapon的部落格](https://kakapontw.blogspot.tw/ "標題") 空空如也.

參考形式

[kakapon的部落格][連結辨識標籤]
[連結辨識標籤]: https://kakapontw.blogspot.tw/ "標題"

[kakapon的部落格][]
[kakapon的部落格]: https://kakapontw.blogspot.tw/ "標題"

參考的部分可以只有連結名稱,但後面還是要接著[],另外連結辨識標籤不分大小寫。

強調

斜體:

*斜體* 或  _斜體_

粗體:

**粗體** 或 __粗體__

程式碼

用反引號把它包起來(`),這邊建議用兩個反引號比較好,因為有可能程式碼中包含反引號,用兩個包比較不會有問題,最後跟程式碼區塊一樣,&<> 會自動轉成 HTML 實體,不用特定轉換。

``程式碼中有 (`) 在這邊。``

圖片

Markdown使用像連結的語法來標記圖片: 行內參考

行內形式

![Alt text](/path/to/blog.jpg)

![Alt text](/path/to/blog.jpg "blog img title")

參考形式

![Alt text][id]

[id]: url/to/blog  "blog img title"

網址與email都可使用,email部分還會幫忙轉換格式,躲避機器人

<http://test.com/>
<test@test.com>

跳脫字元

Markdown 中,想在文字插入普通的符號,需加上反斜線來幫助,下表包含支援的符號:

  1. 反斜線()
  2. 反引號(`)
  3. 星號(*)
  4. 底線(_)
  5. 大括號({})
  6. 方括號([])
  7. 括號(())
  8. 井字號(#)
  9. 加號(+)
  10. 減號(-)
  11. 英文句點(.)
  12. 驚嘆號(!)

進階

下面的格式有些編譯器支援,有些不支援,看自己的配置情況而定。

表格

| Left        | Middle     | Right  |
|:----------- |:----------:| ------:|
| 1-1         | 1-2        | 1-3    |
| 2-1         | 2-2        | 2-3    |

影片

[![IMAGE ALT TEXT HERE](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE)

程式碼區塊(另一種用法)

~~~~~~~~~~~~~~~~~~~~
程式碼放裡面
~~~~~~~~~~~~~~~~~~~~

程式碼標示語言特定文字

支援語言可看:highlightjs.org

```javascript
var s = "JavaScript syntax highlighting";
alert(s);
```

方程式

相對論
$$E = mc^2$$
普通公式
$$x = 100 * y + z - 10 / 33 + 10 % 3$$
上下標
$$x = a_{1}^n + a_{2}^n + a_{3}^n$$

檢查清單

- [ ] Database
- [ ] Android
- [x] Nodejs
- [x] Security
- [x] Markdown

註腳

Here is a footnote reference,[^1] and another.[^longnote]

[^1]: Here is the footnote.
[^longnote]: Here's one with multiple blocks.

Superscript

n^2^456

刪除線

~~strikethrough~~

參考資料

gitbook中文解說
Markdown文件
Markdown中寫數學公式
Markdown footnote

1 則留言: