Markdown 預覽器
免費線上 Markdown 預覽器,即時渲染 Markdown 語法為 HTML,支援分割畫面、即時預覽、複製 HTML、下載 Markdown 檔案。
在左邊(手機在上方)打或貼上 Markdown,右邊立刻照 GitHub 的規則畫出排版結果:標題、清單、表格、任務清單、程式碼上色都看得到。可以切換「分割、原始碼、預覽」三種檢視,按「複製 HTML」拿到轉好的 HTML,或下載成 .md 檔;下方同時顯示字元數、行數、中文字數與英文單字數。全部在瀏覽器處理,內容不會上傳。
三種檢視與四個按鈕
- 分割:左右(手機上下)同時看原始碼與預覽,邊打邊對照。
- 原始碼/預覽:只看其中一邊,編輯區或預覽區變成整個寬度,適合長文件。
- 複製 MD:把整份 Markdown 原文放進剪貼簿。
- 複製 HTML:把轉好的 HTML 放進剪貼簿,貼進網站後台、電子報或 HTML 編輯器;你在 Markdown 裡自己寫的 HTML 會原樣保留。
- 下載:存成 document.md,之後用任何文字編輯器都能打開。
- 清除:一鍵清空編輯區(沒有確認視窗,重要內容先複製或下載)。
打開頁面時會先放一份示範文件,涵蓋標題、清單、引用、程式碼、表格、連結、圖片與任務清單,直接改它就能看到每種語法的效果。
換行與分段的規則
預覽依 GitHub 的規則:單純按一次 Enter 不會換行。下面三段是實際轉出來的 HTML:
只按一次 Enter:接在同一段
第一行
第二行
→ <p>第一行
第二行</p>行尾加兩個空白:段落內換行(<br>)
第一行
第二行
→ <p>第一行<br>第二行</p>空一行:分成兩段
第一段
第二段
→ <p>第一段</p>
<p>第二段</p>想要「按 Enter 就換行」,可以改用站上的 Markdown 轉 HTML(有「自動換行」開關)或 Markdown 編輯器(預設就會換行)。
中文寫 Markdown 常踩的坑
以下範例都是用這個預覽器的轉換規則實際跑出來的:
粗體包住引號、後面緊接中文:星號原樣露出來
這是**「重點」**文字
→ <p>這是**「重點」**文字</p>星號外側各加一個空白就正常
這是 **「重點」** 文字
→ <p>這是 <strong>「重點」</strong> 文字</p>網址後面直接接全形逗號:逗號和後面的字被吃進連結
官網https://example.com,歡迎
→ <p>官網<a href="https://example.com%EF%BC%8C%E6%AD%A1%E8%BF%8E">https://example.com,歡迎</a></p>網址前後留空白:連結只到網址結尾
官網 https://example.com ,歡迎
→ <p>官網 <a href="https://example.com">https://example.com</a> ,歡迎</p># 後面沒有空白:不是標題
#標題
→ <p>#標題</p>原因是 Markdown 判斷粗體與網址的規則以英文標點與空白為準;中文全形標點緊貼著符號時,就會出現上面的情況。
統計數字怎麼算
| 項目 | 怎麼算 |
|---|---|
| 字元數 | 整份原文,含空白與 # * 這些符號;一個 emoji 算 1 |
| 行數 | 原文的行數,空行也算 |
| 中文字數 | 中文字(含日文假名、注音),標點不算 |
| 英文單字 | 以單字計,don't 算 1 個 |
算的是 Markdown 原文,不是預覽出來的文字;要算文章本身的字數,先切到預覽選取文字,再貼到站上的字數統計工具。
預覽的限制
- 不能開檔、不會自動存:這一頁沒有開啟 .md 檔的按鈕,內容也只在目前分頁,重新整理就回到示範文件。要開檔或存檔,改用 Markdown 編輯器(可匯入 .md,未登入存 1 份在這台電腦,登入可存雲端)。
- 圖片要完整網址: 這種相對路徑在這裡找不到圖;請用 https:// 開頭、可以公開瀏覽的圖片網址。
- 預覽會拿掉可執行的內容:script、iframe、onerror 這類會執行程式的 HTML,以及表單、按鈕、style 標籤不會出現在預覽裡;「複製 HTML」拿到的仍是你寫的原樣。
- 沒有數學公式與流程圖:LaTeX 數學公式照原文顯示、Mermaid 流程圖語法顯示成程式碼區塊,腳註語法也不支援;流程圖可以用站上的 Mermaid 圖表製作器。
- 預覽裡的連結:點下去會開新分頁,編輯中的內容不會因為點連結而不見。
Markdown 預覽器功能特點
- 即時渲染預覽(GitHub 風格:表格、任務清單、刪除線、巢狀清單、圖片)
- 程式碼區塊依語言上色
- 分割畫面模式
- 複製 Markdown 或轉好的 HTML
- 下載 Markdown 檔案
- 字數統計
如何使用Markdown 預覽器?
- 在左側(手機在上方)輸入 Markdown 語法
- 右側(手機在下方)即時顯示渲染結果
- 可切換分割/原始碼/預覽模式
- 點擊複製或下載按鈕匯出
Markdown 預覽器常見問題
支援哪些 Markdown 語法?
支援 GitHub 風格的常用語法:標題、粗體、斜體、刪除線、巢狀清單、引用、程式碼區塊(依語言上色)、表格、任務清單、連結與圖片。
預覽結果和最終呈現一樣嗎?
預覽依 GitHub 的規則轉換(單一換行不會換行,要空一行才分段)。但不同平台可能有些微差異,建議在目標平台上做最終確認。
支援即時預覽嗎?
是的,編輯器提供即時預覽功能,您在左側輸入 Markdown 語法時,右側會同步顯示渲染後的效果,方便您即時調整格式。
Markdown 裡可以寫 HTML 嗎?
可以,<kbd>、<details>、<br> 這類排版標籤會照常顯示,「複製 HTML」也會保留你寫的 HTML。預覽為了安全會拿掉 script、iframe、onerror 這類會執行程式的內容。
為什麼我按 Enter 換行,預覽卻接在同一行?
Markdown 的標準規則是單一換行不算換行。要在同一段裡換行,就在行尾加兩個空白;要分段就空一行。想要按 Enter 就換行,可以用站上的 Markdown 編輯器,它預設就是這樣。
預覽裡的圖片為什麼顯示不出來?
多半是圖片網址用了相對路徑(例如 image.jpg)或是需要登入才看得到的網址。請改成 https:// 開頭、公開可瀏覽的完整圖片網址;部分網站禁止別的網頁引用它的圖片,也會顯示不出來。
可以打開電腦裡的 .md 檔預覽嗎?
這一頁沒有開檔按鈕,可以用文字編輯器打開 .md 檔全選複製、貼到左邊。想直接開檔,用站上的 Markdown 編輯器(開啟文件→匯入 .md 檔案)或 Markdown 轉 PDF(開啟 .md 檔案)。