CSV 轉 HTML 表格轉換器 (CSV→HTML)
將 CSV 檔案轉換為使用 <table><tr><td> 標記的 HTML 程式碼片段。可選擇分隔符、是否將首行作為表頭、是否用 <thead>/<tbody> 包裹。轉換結果可即時預覽，並支援複製或下載。轉換完全在瀏覽器內完成，資料不會發送到伺服器。
| 分隔符 |
|
|---|---|
| 將首行作為表頭 | |
| 用 thead/tbody 包裹 |
預覽
HTML 程式碼
已複製！輸入 CSV 資料後，轉換後的 HTML 表格會顯示在這裡。
CSV 行與 HTML 表格的對應關係
| 一行 CSV | name,age,city |
|---|---|
| 轉換後的 HTML 標記 | <tr><td>name</td><td>age</td><td>city</td></tr> |
當首行被用作表頭時，會轉換為一行 <th> 標籤；此後的每一行都會轉換為一行 <td> 標籤。
CSV→HTML 表格轉換是什麼
以 HTML 撰寫表格，須逐列排上 <tr>、逐格排上 <td>，手工作業相當費時。本工具會讀取 CSV，轉換為 <table> 形式的 HTML 片段。結果可當場預覽，因此在複製之前便能確認貼上後的呈現樣貌。
儲存格內的 <、>、& 會自動轉換為 HTML 實體，故含有符號的資料也不會使顯示錯亂。是否以 thead、tbody 包覆亦可選擇。就語意而言加上較為理想，但在 HTML 郵件等解讀不穩定的環境中，去除後的最小構成較為穩定。
HTML 表格的製作方式
- 貼上 CSV 在輸入欄貼上 CSV。若自試算表軟體複製，請將分隔字元改為定位字元。
-
決定標題列的處理
啟用「以首列為標題」後，第一列便會以
<th>標籤輸出。 - 選擇 thead／tbody 的有無 通常維持加上即可。若為 HTML 郵件等顯示不穩定的環境，請予去除。
- 以預覽確認後複製 查看實際算繪出的表格，若無問題便複製 HTML 程式碼貼上。
用好本工具的小技巧
- 貼上到 HTML 郵件或不支援 Markdown 的舊版 CMS 時，不帶 thead/tbody 的最簡輸出往往更容易正常顯示。
- 單元格中的
<、>、&會自動轉義為 HTML 實體，因此貼上生成的程式碼不會破壞頁面佈局。 - 預覽會按瀏覽器實際渲染方式顯示轉換後的表格，方便你在複製程式碼前確認顯示效果。
- 可與姊妹工具 CSV 轉 Markdown、CSV 轉 JSON 搭配使用，將同一份 CSV 按需轉換為三種不同格式。
CSV→HTML 轉換的活用場景
在部落格或 CMS 刊載表格
即使是不支援 Markdown 的 CMS，只要貼至 HTML 編輯模式便可刊載表格。
在 HTML 郵件中放入表格
郵件不會解讀 Markdown，故放入表格須用 HTML。去除 thead／tbody 的最小構成較為穩定。
製作實作前的模型
在畫面設計階段，可立即將接近實際資料的表格轉為 HTML，亦可用於確認樣式的套用情形。
安全刊載含符號的資料
含不等號或&的值也會自動轉義，因此貼上後版面不會破損。
HTML 表格的用語
- table 元素
- 指表示表格的 HTML 標籤。就其表現具有列與欄之實際資料的本來用途而言，至今仍是最合適的標籤。
- th 與 td
<th>為標題儲存格，<td>為資料儲存格。加以區別可讓朗讀軟體傳達其對應關係。- thead／tbody
- 指就語意區分標題部分與本文部分的標籤。亦與長表格列印時重複顯示標題的行為有關。
- HTML 實體
- 指為安全顯示符號的寫法。
<會被置換為<之類的形式。 - 表格版面配置
- 指以表格框線構成整頁分欄的舊手法。現今已被視為明確的反模式。
常見問題
<table> 標記，因此可以直接貼上到 WordPress 的 HTML 編輯模式，或 HTML 郵件的正文中。
閒話 ― 為什麼 <table> 標籤至今仍未消失
在上世紀90年代末 Web 發展初期，用 <table> 標籤搭建整個頁面佈局的"表格佈局"曾是主流做法。當時 CSS 的排版能力有限，表格幾乎是實現多欄佈局的唯一實用手段，因此那個年代的 HTML 原始碼中充斥著與表格資料本身毫無關係的 <table> 元素。
如今 CSS 已經成熟，Flexbox 與 Grid 廣泛普及，用表格做佈局早已被視為典型的反模式。但在其本來的用途——表示按行列組織的真實資料——上，<table> 依然是最合適、也最具無障礙訪問優勢的標籤，因為螢幕閱讀器能夠識別並朗讀 <th> 與 <td> 之間的對應關係。
將 CSV 內容貼上到部落格文章或郵件通訊中的需求至今依然普遍存在，因為 HTML 郵件無法渲染 Markdown，部分 CMS 也沒有 Markdown 外掛。能一鍵將電子表格結果轉換為 HTML 表格的工具，正好滿足了這種樸素卻長期存在的實際需求。