抱歉,您的瀏覽器無法訪問本站
本頁面需要瀏覽器支持(啟用)JavaScript
了解詳情 >

這邊紀錄一些比較常使用的 markdown 語法,不過需要注意的是這些語法會因應用程式或是剖析器,產生不同的渲染結果。最常見的例子就是用 Notion 的筆記內容轉貼到 VSCode 上,產生兩邊格式不一致的問題,需要按照使用軟體而有所調整。

1. 文字格式類

顯示語法與範例

1.1 標題

語法
1
2
3
4
5
主標題
===

副標題
---
檢視效果

主標題

副標題

1.2 文字大小

語法
1
2
3
4
5
6
7
# H1
## H2
### H3
#### H4
##### H5
###### H6
normal Text
檢視效果

H1

H2

H3

H4

H5
H6

normal Text

1.3 字體效果

語法
1
2
3
4
5
6
7
8
9
10
11
*1. 斜體字* 
_1. 斜體字_
**2. 粗體字**
***3. 斜體+粗體字***
__3. 斜體+粗體字*__
~~4. 刪除線~~
5. 上標字^上標^
6. 下標字~下標~
++7. 底線++
==8. 螢光線==
`9. Code`
檢視效果

1. 斜體字
1. 斜體字
2. 粗體字
3. 斜體+粗體字
3. 斜體+粗體字*
4. 刪除線
5. 上標字^上標^
6. 下標字下標
++7. 底線++
==8. 螢光線==
9. Code

根據應用軟體不同,有些格式的語法無法按照預期渲染。

2. 文章段落

顯示語法與範例

2.1 段落

語法
1
2
\tab 文字 -> 縮排
斷行 斷行△△ (△表示空白)

根據應用軟體不同,有些格式的語法無法按照預期渲染。

2.2 清單

語法
1
2
3
4
5
6
7
8
9
10
<!-- 無序 -->
* 清單一
* 清單二
* 清單三
+ 清單四
- 清單五
<!-- 有序 -->
1. 清單一
2. 清單二
3. 清單三
檢視效果
無序清單
  • 清單一
  • 清單二
  • 清單三
  • 清單四
  • 清單五
序列清單
  1. 清單一
  2. 清單二
  3. 清單三

note 編寫清單時無論是標號或是符號,再項次內容前須加上一個空白

note 當數字為起頭後面加上點(.),剖析器會自動視為清單類型,如果非清單需再(.)之前加上跳脫符號(\)

2.3 階層清單

語法
1
2
3
4
5
6
7
8
9
10
11
<!-- 無序 -->
* 清單
* 清單
* 清單

<!-- 有序 -->
1. 清單一
1. 清單2-1
2. 清單2-2
1. 清單2-2-1
2. 清單二
檢視效果
無序清單
  • 清單
    • 清單
      • 清單
序列清單
  1. 清單一
    1. 清單2-1
    2. 清單2-2
      1. 清單2-2-1
  2. 清單二

2.4 段落清單

1
2
3
1. HTML(HyperText Markup Language,超文本標記語言)是打造網頁的基石。它表述並定義網頁的內容。伴隨 HTML 而來的技術還有描述網頁外觀(CSS)及功能性的程式語言(JavaScript)。
「超文本」(HyperText)是指從某個網頁連到其他網頁的連結,不管它連結到站內抑或站外。連結連結 Web 的核心概念。藉由撰寫與上載網頁到網際網路中,你就積極參與了全球資訊網(World Wide Web)。
2. HTML 文件中的元素和其他內容文字不同的地方,在於元素名稱本身用「<」與「>」包圍,稱作「標籤」。HTML 標籤不分英文大小寫。也就是說,它們可以寫成英文全大寫、全小寫、或是混在一起。像是 \<title\> 能寫成 \<Title\>,\<TiTlE\>……等等。
檢視效果
  1. HTML(HyperText Markup Language,超文本標記語言)是打造網頁的基石。它表述並定義網頁的內容。伴隨 HTML 而來的技術還有描述網頁外觀(CSS)及功能性的程式語言(JavaScript)。
    「超文本」(HyperText)是指從某個網頁連到其他網頁的連結,不管它連結到站內抑或站外。連結連結 Web 的核心概念。藉由撰寫與上載網頁到網際網路中,你就積極參與了全球資訊網(World Wide Web)。
  2. HTML 文件中的元素和其他內容文字不同的地方,在於元素名稱本身用「<」與「>」包圍,稱作「標籤」。HTML 標籤不分英文大小寫。也就是說,它們可以寫成英文全大寫、全小寫、或是混在一起。像是 <title> 能寫成 <Title>,<TiTlE>……等等。

note 同一項次內的不同段落需要加上tab縮排作為表示該段落是同一個項次內容。

2.5 引用縮排

語法
1
2
3
4
5
> 第一層引用
>> 第二層引用
>>> 第三層引用
>>>> 第四層引用
>>>>> 第五層引用
檢視效果

第一層引用

第二層引用

第三層引用

第四層引用

第五層引用

2.6 分隔線

語法
1
2
3
4
5
6
7
8
9
* * *

***

*****

- - -

---------------------------------------
檢視效果





作為分隔線時,同一行內不能存在其他元素或文字。

2.7 程式碼區塊

```[程式語言]
程式碼
```
```php
$a = “String”;
var_dump($a);
```

檢視效果
1
2
$a = "String";
var_dump($a);

不同的解析器或應用程式在選染程式碼時上色會有所不同。

3. 多媒體元素

顯示語法與範例

3.1 超連結

語法
1
2
3
4
5
6
7
8
9
10
11
12
<!-- 一般超連結 -->
<https://markdown.tw/>

<!-- 文字超連結 -->
[超連結](https://markdown.tw/)

<!-- 標籤超連結 -->
This is [顯示文字][標籤名稱] reference-style link.

<!-- 使用標籤超連結 需在其他地方新增對應標籤與網址 -->
[標籤名稱]: http://example.com/ "替代文字"

檢視效果
  1. 一般超連結: https://markdown.tw/
  2. 文字超連結: 超連結
  3. 標籤超連結: 標籤超連結 類似於學術文章裡面的參考文獻。
  4. 作為標籤超連結的標籤網址列不會顯示於頁面上

3.2 圖片

語法
1
2
3
4
5
![Alt text](/path/to/img.jpg)
![Alt text](/path/to/img.jpg "img中Title屬性的值")
<!-- 同標籤超連結 -->
![Alt text][標籤]
[標籤]: /path/to/img.jpg "文字"
檢視效果

Markdown Logo

Markdown 沒辦法指定圖片的長寬,代替方案為使用 HTML 的 <img> 標籤。

大多數的 markdown 編輯器都沒有保存檔案的功能,需要使用第三服務進行圖片代管。

3.3 表格

語法
1
2
3
| 欄位1 | 欄位2 | 欄位3 |
| :-- | --: |:--:|
| 置左 | 置右 | 置中 |
  • 表格語法用| 作為元素區隔,斷行為表格下一列
  • 第一行為表頭元素
  • 第二行表示排列方式,這一列不會渲染於畫面上
    • :-- 元素置左
    • --: 元素置右
    • :--: 元素置中
  • 排列方式之後的橫行為表格內容
檢視效果
日期台幣日幣
2024/05/0514.82
2024/5/06100482
2024/5/71000048200
置左置右置中

4. 其他

顯示語法與範例

4.1 跳脫字元

需要跳脫字元的特殊符號
1
2
3
4
5
6
7
8
9
10
11
12
\   反斜線
` 反引號
* 星號
_ 底線
{} 大括號
[] 方括號
() 括號
# 井字號
+ 加號
- 減號
. 英文句點
! 驚嘆號
  • 上述這些特殊符號要顯示需要加上跳脫字元 \
  • 例如用 * 強調某個文字時(*強調文字*) 須使用 \*表示
    • 未加上跳脫字元會變成 (強調文字) 斜體文字

留言