以下是一個全面的 Markdown 效果展示。為了讓您既能看到渲染後的效果,又能知道如何編寫,我在每個小節都提供了效果演示和對應的語法說明。
在文檔的最後,我還提供了一個完整的 Markdown 源碼塊,方便您一鍵複製和學習。
📚 Markdown 全面效果展示
1. 標題 (Headers)
Markdown 支援 6 級標題,使用 # 的數量來表示級別。
一級標題 (H1)
二級標題 (H2)
三級標題 (H3)
四級標題 (H4)
五級標題 (H5)
六級標題 (H6)
語法:
# 一級標題,## 二級標題…###### 六級標題
2. 文本格式化 (Text Formatting)
您可以對文本進行各種格式化操作:
- 這是粗體文本
- 這是斜體文本
- 這是粗斜體文本
這是刪除線文本這是行內代碼- 這是底線(使用 HTML 標籤)
- 這是高亮文本(部分編輯器支援)
語法:
**粗體**,*斜體*,***粗斜體***,~~刪除線~~,`行內代碼`,<u>底線</u>,==高亮==
3. 列表 (Lists)
無序列表
- 蘋果
- 香蕉
- 嵌套的香蕉品種 1
- 嵌套的香蕉品種 2
- 橘子
有序列表
- 第一步:打開編輯器
- 第二步:輸入 Markdown 語法
- 第三步:匯出為 HTML 或 PDF
任務列表 (Task Lists)
- 已經完成的 task
- 尚未完成的 task
- 另一個待辦事項
語法:
- 無序:
- 項目或* 項目- 有序:
1. 項目,2. 項目- 任務列表:
- [ ] 未完成,- [x] 已完成
4. 引用 (Blockquotes)
這是一段普通的引用。 它可以跨越多行。
這是嵌套的引用。 就像俄羅斯套娃一樣。
引用中也可以包含其他元素,比如:
- 列表項
行内代码- 粗體文字
語法: 使用
>表示引用,>>表示嵌套引用。
5. 代碼塊 (Code Blocks)
行內代碼使用反引號:console.log("Hello World");
多行代碼塊使用三個反引號,並可以指定語言以實現語法高亮:
def fibonacci(n):
"""計算費波那契數列"""
if n <= 1:
return n
return fibonacci(n - 1) + fibonacci(n - 2)
# 列印前 10 個數字
for i in range(10):
print(fibonacci(i), end=" ")
print()
// JavaScript 示例
const greet = (name) => {
console.log(`Hello, ${name}!`);
};
greet("Markdown");
語法: 使用
結束。語言名稱</code> 開始,使用 <code>
6. 連結與圖片 (Links & Images)
語法:
- 連結:
[顯示文字](URL "可選標題")- 圖片:
- 圖片連結:
[](跳轉URL)
7. 表格 (Tables)
| 左對齊 (Left) | 居中對齊 (Center) | 右對齊 (Right) | 預設對齊 (Default) |
|---|---|---|---|
| 單元格 1 | 單元格 2 | 單元格 3 | 單元格 4 |
| 粗體 | 斜體 | 代碼 | |
| 長文本會自動換行或截斷,取決於渲染器 | 資料 | 100 | 200 |
語法: 使用
|分隔列,使用-分隔表頭。:---左對齊,:---:居中,---:右對齊。
8. 分割線 (Horizontal Rules)
可以在行中使用三個或更多的 -、* 或 _ 來建立分割線:
9. 高級擴充語法 (Extended Syntax)
(註:以下功能需要 Markdown 渲染器支援,如 Typora, Obsidian, GitHub, Notion 等)
📌 註腳 (Footnotes)
📐 數學公式 (Math / KaTeX)
行內公式:質能方程 是一個著名的公式。
塊級公式:
📊 圖表 (Mermaid Diagrams)
graph TD
A[開始] --> B{是否理解 Markdown?}
B -->|是| C[開始寫作!]
B -->|否| D[閱讀本指南]
D --> B
C --> E[結束]

😀 Emoji 表情
支援直接使用 Unicode Emoji 或簡寫代碼(取決於渲染器):
🎉 🚀 💡 ✅ ❌
語法示例::rocket: :smile: :+1:
📥 附錄:完整 Markdown 源碼
您可以點擊代碼塊右上角的「複製」按鈕,將以下完整源碼複製到您的 Markdown 編輯器中進行測試和修改。
# 📚 Markdown 全面效果展示
## 1. 標題 (Headers)
# 一級標題 (H1)
## 二級標題 (H2)
### 三級標題 (H3)
#### 四級標題 (H4)
##### 五級標題 (H5)
###### 六級標題 (H6)
---
## 2. 文本格式化 (Text Formatting)
- **這是粗體文本**
- _這是斜體文本_
- _**這是粗斜體文本**_
- ~~這是刪除線文本~~
- `這是行內代碼`
- <u>這是底線(使用 HTML 標籤)</u>
- ==這是高亮文本(部分編輯器支援)==
---
## 3. 列表 (Lists)
### 無序列表
- 蘋果
- 香蕉
- 嵌套的香蕉品種 1
- 嵌套的香蕉品種 2
- 橘子
### 有序列表
1. 第一步:打開編輯器
2. 第二步:輸入 Markdown 語法
3. 第三步:匯出為 HTML 或 PDF
### 任務列表 (Task Lists)
- [x] 已經完成的 task
- [ ] 尚未完成的 task
- [ ] 另一個待辦事項
---
## 4. 引用 (Blockquotes)
> 這是一段普通的引用。
> 它可以跨越多行。
>
> > 這是嵌套的引用。
> > 就像俄羅斯套娃一樣。
>
> **引用中也可以包含其他元素**,比如:
>
> - 列表項
> - `行內代碼`
> - **粗體文字**
---
## 5. 代碼塊 (Code Blocks)
行內代碼使用反引號:`console.log("Hello World");`
多行代碼塊使用三個反引號,並可以指定語言以實現**語法高亮**:
```python
def fibonacci(n):
if n <= 1:
return n
return fibonacci(n - 1) + fibonacci(n - 2)
print(fibonacci(10))
```
---
## 6. 連結與圖片 (Links & Images)
- **普通連結**: [造訪 GitHub](https://github.com)
- **帶標題的連結**: [造訪 Google](https://google.com "點擊跳轉到 Google")
- **圖片**:

- **圖片作為連結**: [](https://picsum.photos)
---
## 7. 表格 (Tables)
| 左對齊 (Left) | 居中對齊 (Center) | 右對齊 (Right) | 預設對齊 (Default) |
| :------------ | :---------------: | -------------: | ------------------ |
| 單元格 1 | 單元格 2 | 單元格 3 | 單元格 4 |
| **粗體** | _斜體_ | `代碼` | ~~刪除~~ |
---
## 8. 分割線 (Horizontal Rules)
---
---
## 9. 高級擴充語法 (Extended Syntax)
### 📌 註腳 (Footnotes)
這是一個帶有註腳的句子,請看這裡[^1]。
[^1]: 這是第一個註腳的具體內容,通常顯示在頁面底部。
### 📐 數學公式 (Math / KaTeX)
行內公式:質能方程 $E = mc^2$ 是一個著名的公式。
塊級公式:
$$
\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}
$$
### 📊 圖表 (Mermaid Diagrams)
```mermaid
graph TD
A[開始] --> B{是否理解 Markdown?}
B -->|是| C[開始寫作!]
B -->|否| D[閱讀本指南]
D --> B
C --> E[結束]
```
### 😀 Emoji 表情
🎉 🚀 💡 ✅ ❌
您可以直接複製上面的代碼塊到您的編輯器中(確保開啟了相應的擴充支援)查看效果。
