台灣工具箱 台灣工具箱taiwan-tools.com

Markdown 語法學習器
邊做題邊學,即時預覽、自動批改

別再開一份文件對照著背。這裡給你一個目標效果,你在左邊寫 Markdown,右邊即時預覽,系統比對「渲染出來的效果」自動判對。15 關由淺到深,從基礎語法到組合實作,學會跟 AI 和 GitHub 溝通最常用的語法。免費、免登入。

1 關 · 標題
任務
你的 Markdown
即時預覽
快捷
開始作答

    語法速查表 線上編輯器

    Markdown 是什麼,為什麼現在值得學

    Markdown 是一種用純文字寫「有格式文件」的寫法。你只要在字的前後加幾個符號,例如用兩個星號把字包起來就變粗體、行首放一個井號就變標題,存檔還是純文字檔(副檔名 .md),卻能被 GitHub、Notion、HackMD、Discord 以及各種 AI 對話介面直接渲染成漂亮的排版。

    會紅起來有兩個原因。第一,工程師的說明文件(README)幾乎都用 Markdown。第二,也是現在最實際的:跟 AI 協作、做 vibe coding 的時候,把需求用 Markdown 結構化寫清楚,AI 讀得更準、回得更好。學會這套語法,等於學會一種跟機器溝通的通用格式。

    語法速查表

    下面把常用語法整理成對照卡:左邊是你要打的原始碼,右邊是它變出來的效果。練習卡關時可以回來查。

    標題
    # 一級標題
    ## 二級標題
    ### 三級標題
    井號數量代表層級,最多六層。井號後要空一格。
    粗體與斜體
    **粗體** *斜體* ***兩者***
    兩個星號是粗體,一個是斜體,三個兩者都有。用底線 __ _ 效果一樣。
    清單
    - 無序項目
    - 無序項目
      - 縮排兩格變子項
    
    1. 有序項目
    2. 有序項目
    無序用減號或星號,有序用數字加點。子清單縮排兩個空白。
    連結與圖片
    [顯示文字](https://網址)
    ![替代文字](圖片網址)
    中括號放文字、小括號放網址。圖片就是連結前面多一個驚嘆號。
    程式碼
    行內用 `單反引號`
    
    ```python
    print("三個反引號包整段")
    ```
    行內用單個反引號,整段用三個反引號包住,開頭那行可標語言。
    引言與分隔線
    > 這是一段引言
    
    ---
    引言每行前面加大於符號。三個減號單獨成行是分隔線(上面要留空行)。
    表格
    | 品項 | 數量 |
    | --- | --- |
    | 蘋果 | 3 |
    用直線分欄,第二行的減號是標題和內容的分隔。對齊可用冒號。
    待辦清單
    - [ ] 還沒做
    - [x] 已完成
    中括號空白是未完成、放 x 是打勾。交辦任務給 AI 或自己列步驟很好用。

    寫給 AI 看的 Markdown

    跟 AI 溝通時,Markdown 的重點是幫 AI 分清楚「哪裡是需求、哪裡是程式碼、哪裡是步驟」,排版只是附帶的好處。幾個實用習慣:

    常見問題

    學這個一定要會寫程式嗎?

    不用。Markdown 是純文字排版語法,寫筆記、寫文件、跟 AI 對話都用得到,跟會不會寫程式沒關係。這個學習器也是從最基本的標題、粗體開始。

    我答對了卻沒過關,是哪裡有問題?

    本工具比對的是「渲染後的效果」而不是你打的字,所以同一個效果有多種寫法都算對。沒過關通常是效果還沒達成,例如分隔線的三個減號上面要空一行,否則會被當成標題。看右邊預覽和下方的檢查清單,哪一項還沒打勾就是還差那裡。

    不同平台的 Markdown 都一樣嗎?

    核心語法(標題、粗體、斜體、清單、連結、程式碼、引言)幾乎到哪都一樣,刪除線多數平台也支援。表格和待辦清單屬於 GitHub 風格的延伸語法,GitHub、HackMD 支援,但 Discord 不支援,少數陽春編輯器也可能不吃,實際以你用的平台為準。

    我的練習內容會被上傳嗎?

    不會。所有輸入與判題都在你的瀏覽器裡完成,不傳到伺服器。進度只存在你這台裝置的瀏覽器(localStorage),換裝置或清除資料就會重來。

    學完這裡還能去哪裡練?

    把學到的直接用在真實地方最有效:GitHub 的 README、HackMD 共筆、Notion 筆記,或下次跟 AI 對話時用程式碼區塊和清單把需求寫清楚。回來這頁隨時可以查語法速查表。

    ※ 本工具的預覽以通用 Markdown 與 GitHub 風格延伸語法渲染,作為學習參考。實際顯示效果依你使用的平台(GitHub、HackMD、Notion、Discord 等)支援的語法而定。