Markdown 轉 HTML

把 Markdown 轉成 HTML 這件事看起來只是換標籤，實際麻煩在規則細節：表格為什麼沒算繪、段落裡換行為什麼被吃掉、程式碼區塊裡的尖括號要不要自己轉義、目錄錨點怎麼和標題對上。這個工具把這些規則寫成可開關的選項，右側預覽所見即所得，左側改一個字元右側立刻變，轉換結果可以直接複製走或下載成檔案。

支援的語法

• 區塊：# 到 ###### 標題與 ===、--- 底線式標題；段落；圍欄程式碼區塊（三個反引號或波浪號，帶語言名時輸出 class="language-xxx"）；四個空格起手的縮排程式碼區塊；可巢狀的引用；無序清單用 - * +，有序清單用 1. 或 1)，起始數字會保留成 <ol start>；分隔線 --- *** ___
• 清單細節：按縮排層級巢狀，換用另一種標記符號會另起一個清單，條目之間留空行會產生鬆散清單（條目包成 <p>），GFM 任務清單核取方塊輸出為不可勾選的 input，關閉 GFM 時保留原文
• 表格：需要表頭加分隔列，:--- ---: :---: 分別對應左中右對齊，輸出為 style="text-align:..."；行內儲存格不足會補齊，多餘會提示並忽略，儲存格裡的豎線用 \| 轉義
• 行內：**粗**、*斜*、***粗斜***、_底線斜_、~~刪除線~~、`行內程式碼`（一行裡用兩個或三個反引號包反引號也可以），行內程式碼優先於強調標記，所以 `*a*` 不會被當成斜體
• 連結與圖片：行內式 [文字](url "標題")、參考式 [文字][標記] 配 [標記]: url、尖括號自動連結 <https://…> 與 <mailto:…>、裸連結自動辨識、圖片 ![alt](src)
• 換行：行末兩個空格或一個反斜線是硬換行，輸出 <br>；普通換行預設併入同一段落，勾選「軟換行轉 br」後每行都斷
• 轉義：反斜線轉義 \* 這類符號，未辨識的字元按字面輸出

標題錨點與目錄

• 每個標題按文字產生 slug 作為 id，中文保留、標點去掉、空格變連字號，同名標題自動追加 -1、-2，長文裡不會出現錨點互相覆蓋
• 開啟「產生目錄」後在正文前插入巢狀的 <ul>，層級對應標題級別，配合錨點就是一套頁內導覽
• 關閉「標題錨點」則輸出乾淨的 <h2>，適合貼到已經自帶目錄的系統裡

關於原始 HTML

• 預設關閉「允許 HTML」：正文裡的尖括號與引號全部轉義，寫 <script> 只會顯示成文字，靜態部落格正文、留言區這類場景更安全
• 打開後原樣輸出原始碼裡的 HTML 區塊，方便嵌入 <details>、表格合併儲存格、<img width> 這類 Markdown 表達不了的結構；此時請確保內容是自己寫的
• 程式碼區塊裡的尖括號無論開關都會轉義，貼程式碼不會被解析成標籤

複製與下載

• 複製 HTML：直接把片段貼進範本或富文字原始碼檢視
• 複製後轉義：把結果裡的 < > & " 再轉一層實體，用來寫文件說明、教學範例，或者往 HTML 裡嵌一段 HTML
• 下載 .md / .html：HTML 檔帶 <meta charset>，編碼下拉裡可以選帶 BOM 的 UTF-8，避免 Windows 記事本或舊瀏覽器打開時中文亂碼
• 正文存在瀏覽器本機，重新整理或下次打開會自動回到上次的文字和選項

常見問題

• 為什麼我寫的表格沒變成表格？最常見的三種情況：缺分隔列（表頭下面那行 |---|---|）、關閉了 GFM 擴充、整張表前後沒空行而被當成正文。缺分隔列或某行儲存格多於表頭時，頁面下方會給出解析提示
• 段落裡的換行為什麼被吃掉？Markdown 的規則是單個換行不算換行，需要行末留兩個空格、寫一個反斜線，或者乾脆空一行分段；嫌麻煩就勾上「軟換行轉 br」
• 和 HTML 格式化工具的差別？本工具做的是標記語言到標籤的轉換，轉換完的 HTML 如果想再排版縮排、換行對齊，可以用 HTML 格式化
• 支援註腳、定義清單、程式碼高亮嗎？不支援。註腳與定義清單屬於各家擴充，沒有統一實作；這裡也不引入高亮函式庫，只輸出 class="language-x"，交給你的站台範本去做著色
• 開啟「允許 HTML」有風險嗎？有。這個模式下你寫的標籤會原樣進入結果，貼上來的內容裡若帶腳本就會被執行。只是想把別人給的 HTML 洗成純文字的話，別開這個開關
• 內容會上傳嗎？不會。解析、預覽、複製、下載全部在瀏覽器裡完成，頁面不發任何請求，斷網也能用
• 長文件會卡嗎？自動轉換有輕微防抖，幾萬字級別的文件也不會邊打字邊卡頓；統計行會顯示來源字元數、行數與產生 HTML 的位元組數，便於估算體積
• 轉換提示和報錯有什麼用？解析出問題時會帶行號提示（例如程式碼圍欄沒有閉合會按到文末處理並告訴你位置），不會靜默吞掉內容

轉好的 HTML 想再整理縮排用 HTML 格式化；只想要裡面的純文字用 HTML 去標籤；要把成段標籤當文字貼進程式碼裡用 HTML 實體編碼；改完一版想對比差異用文字比對；統計正文字數與段落用字數統計。