將 HTML 表格轉為 Markdown 表格
要把 HTML 的 <table> 放到 README、GitHub Issue、Notion 或部落格裡,用 FormatArc 的 HTML 轉 Markdown 工具把 HTML 貼進去、複製結果就行。所有處理都在瀏覽器內完成,資料不會傳到外部伺服器。
- 打開 HTML 轉 Markdown 工具。
- 貼上 HTML 程式碼(整個
<table>元素,或包含它的頁面片段)。 - 按「執行」,複製輸出的 GitHub Flavored Markdown 表格。
以下說明這個轉換具體做了哪些事、如何防止表格崩壞、以及 Markdown 表格格式本身的限制。


轉換範例(轉換前與轉換後)
假設有一個基本的 HTML 表格:
<table>
<tr><th>名稱</th><th>角色</th><th>團隊</th></tr>
<tr><td>小王</td><td>工程師</td><td>基礎架構</td></tr>
<tr><td>小陳</td><td>設計師</td><td>前端</td></tr>
</table>
把這段程式碼貼到轉換工具裡,就會得到 GitHub Flavored Markdown 表格:
| 名稱 | 角色 | 團隊 |
| --- | --- | --- |
| 小王 | 工程師 | 基礎架構 |
| 小陳 | 設計師 | 前端 |
第一個 <tr> 變成標題列,分隔線(---)自動生成。輸出預設為左對齊的 GFM 表格,在 GitHub、GitLab、Notion 等支援 Markdown 的環境中都能直接顯示。
自動處理容易出錯的表格
從 HTML 轉 Markdown 表格時,真正棘手的不是結構簡單的情況,而是儲存格內容中的特殊字元、或是每列儲存格數量不一致,這些會悄悄讓表格崩壞。以下三種常見情況都會自動處理。
儲存格內含直線(|)
在 Markdown 表格中,| 是欄位分隔符。如果儲存格內容裡直接出現 |,解析器會錯誤地分割欄位,導致表格結構出錯。轉換工具會自動轉義。
<td>a | b</td>
轉換後變成 a \| b,欄位數不會對不齊。
儲存格內含換行
儲存格內容如果有換行,Markdown 會把它當成新的一列,整個表格排版就亂了。儲存格內的換行會被替換成一個空格,確保每列資料維持在一行。
每列儲存格數量不同
即使有的列比標題列多或少的儲存格,轉換工具也會把所有資料列對齊到標題列的欄位數。多出的會被裁掉,不足的會以空儲存格補上,產出不會欄位錯位的正確表格。
關於 Markdown 表格格式本身的規則,可參考 Markdown 表格語法 與 GFM 表格速查。
從網頁複製表格來轉換
手邊沒有 HTML 原始碼、只看到畫面上顯示的表格,這種情況很常見。要把它變成 Markdown 表格,有兩種可靠的方法。
複製 HTML 元素
在瀏覽器中右鍵點擊表格,選「檢查」,然後在開發者工具中對 <table> 元素右鍵選「複製」→「複製元素」。把複製到的 HTML 貼到 HTML 轉 Markdown 工具裡轉換。
直接複製畫面上的儲存格
如果是用滑鼠選取畫面上表格的儲存格來複製(或從試算表複製),通常得到的不是 HTML,而是以 Tab 分欄的文字。這種情況適合用 CSV 轉 Markdown 工具,它能讀取 Tab 分欄或逗號分欄的文字。
簡單說:手上有 HTML 標籤就用 HTML 轉 Markdown,從畫面或試算表複製的儲存格文字就用 CSV 轉 Markdown。
轉換結果不符合預期時
轉換工具預設處理一般的 HTML 表格結構。有些 HTML 結構因為 Markdown 表格格式本身不支援,無法直接轉換:
- 沒有標題列 — 第一個
<tr>一律當作標題列。如果你的表格沒有標題列,第一列資料會被當成標題。需要的話在輸出上方加上標題列。 - 合併儲存格(
rowspan/colspan)— Markdown 表格沒有合併儲存格的概念(參考 GFM 規範的 Tables (extension)在新分頁中開啟)。合併的儲存格不會被自動展開,複雜的合併表格需要先展開再轉換。 - 巢狀表格 — 儲存格裡面又放一個
<table>的話,列掃描時結構會混在一起,無法正常轉換。內層表格需要另外單獨轉換。 - 儲存格內的連結與文字樣式 — 儲存格內容會以純文字處理,標籤和連結會被攤平成文字。需要的話在輸出的 Markdown 表格中重新加入連結。
- 欄位對齊 — 預設輸出是左對齊。如果要中對齊(
:---:)或右對齊(---:),修改分隔列中的冒號位置就行。
合併儲存格不只是「不展開」,位置不對時值會直接消失。colspan 在標題列時,Markdown 表格的欄位數由標題列的儲存格數決定,整欄可能直接不見(實測重現方式在 scripts/benchmarks/html-table-merged-cells/)。
轉換前:
<table>
<tr><th colspan="2">Name</th><th>Price</th></tr>
<tr><td>Widget</td><td>Blue</td><td>$3</td></tr>
</table>
轉換後(實測):
| Name | Price |
| --- | --- |
| Widget | Blue |
$3 沒有出現在輸出中。標題列被算成 Name 和 Price 兩個儲存格,表格變成兩欄,資料列的第三個儲存格被裁掉了。
反過來,rowspan 不會讓值消失,但會讓欄位移。
轉換前:
<table>
<tr><th>Region</th><th>City</th><th>Pop</th></tr>
<tr><td rowspan="2">APAC</td><td>Tokyo</td><td>14M</td></tr>
<tr><td>Seoul</td><td>9M</td></tr>
</table>
轉換後(實測):
| Region | City | Pop |
| --- | --- | --- |
| APAC | Tokyo | 14M |
| Seoul | 9M | |
第二列的 Seoul 跑到 Region 欄,Pop 欄變成空白。因為 rowspan 省略的儲存格不會被回填。含有合併儲存格的表格,轉換前先把合併展開(每個儲存格都填入值)再貼進去比較安全。
如果轉換出來的表格在畫面上看起來亂了,大多數時候原因是合併儲存格或巢狀表格。如果要轉換的不是單一表格,而是包含標題、清單、連結等整個 HTML 文件,直接用同一個工具的完整轉換功能即可。
瀏覽器端完成、無上傳
所有轉換作業都在瀏覽器內以 JavaScript 執行。貼進去的 HTML 不會傳到伺服器、不會被記錄、也不會被儲存。
當表格內容包含內部客戶資料、價格表、非公開儀表板的統計等敏感資訊時,資料安全很重要。許多線上轉換工具會把輸入內容上傳到伺服器處理,但 FormatArc 只在你的裝置上運算,可以安心使用。
常見問題
怎麼把 HTML 表格轉成 Markdown 表格?
把含有 <table> 標籤的 HTML 貼到 FormatArc 的 HTML 轉 Markdown 工具,按「執行」。第一列會變成標題列,可以直接複製 GitHub Flavored Markdown 表格。
為什麼轉換後的 Markdown 表格會壞?
最常見的原因是 Markdown 表格格式不支援的合併儲存格(rowspan / colspan)和巢狀表格。儲存格內的直線和換行會自動處理,如果欄位錯位,先檢查有沒有合併儲存格或巢狀表格。
儲存格內的連結或粗體會保留嗎?
不會。儲存格內容會以純文字轉換,連結和排版會變成文字。需要的話在輸出的 Markdown 表格中重新加入。
HTML 表格沒有標題列會怎樣?
第一個 <tr> 一律當作標題列。沒有標題列的表格,第一列資料會被當作標題。需要的話在輸出上方加上標題列。
從網站複製的表格也能轉嗎?
可以。在瀏覽器開發者工具中複製 <table> 元素,貼到 HTML 轉 Markdown 工具即可。如果是複製畫面上可見的儲存格,會得到 Tab 分欄文字,用 CSV 轉 Markdown 工具處理。
總結
- 把 HTML
<table>貼到 HTML 轉 Markdown 工具就能得到 GitHub Flavored Markdown 表格。 - 儲存格內的直線(
|)會轉義、換行替換為空格、欄位數自動對齊,表格不會崩壞。 - 合併儲存格(
colspan/rowspan)和巢狀表格在 Markdown 表格格式中不受支援,轉換前需要展開。 - 從試算表或網頁複製的儲存格文字用 CSV 轉 Markdown 工具處理。
- 所有處理在瀏覽器內完成,敏感資料也能安心轉換。