Markdown 转 HTML
将 Markdown 转换为简洁的 HTML — 实时并排预览。
关于此工具
支持 CommonMark 及 GitHub Flavored Markdown 扩展:表格、任务列表、围栏代码块、自动链接和删除线。
使用方法
- 1 将Markdown输入或粘贴到左侧编辑器面板中。
- 2 右侧渲染的HTML预览实时更新。
- 3 点击HTML标签查看原始HTML输出。
- 4 点击"复制HTML"将HTML复制到剪贴板。
What Markdown is and why it converts to HTML
Markdown is a lightweight markup language: you write plain text with a few punctuation conventions, and a converter turns it into HTML that a browser can render. The point is that the source stays readable. A heading is just a line starting with #; bold is text wrapped in **double asterisks**; a link is [label](url). Because the raw file is human-friendly, Markdown became the default for README files, documentation, static-site posts, chat messages, and note-taking apps. This tool takes that Markdown and produces the equivalent HTML tags, showing both a live preview and the raw markup you can copy.
How the conversion happens, rule by rule
Conversion is essentially a series of pattern replacements applied in a deliberate order. This tool first escapes the characters &, <, and > so that any HTML you typed is shown as text rather than executed — an important safety step. Then it rewrites the Markdown syntax into tags:
| You type | You get |
|---|---|
# Title | <h1>Title</h1> |
## Section | <h2>Section</h2> |
**bold** | <strong>bold</strong> |
*italic* | <em>italic</em> |
`code` | <code>code</code> |
[text](url) | <a href="url">text</a> |
- item | <li>item</li> inside a <ul> |
| blank line | new <p> paragraph |
Order matters: fenced code blocks (triple backticks) are handled before inline backticks, and the escaping runs first so that the angle brackets in your generated tags are the tool's, not yours. Headings are matched at the start of a line, which is why # in the middle of a sentence stays literal.
A worked example
Type this into the input:
# NotesA list of **key** points:- first- second
The tool produces an <h1>Notes</h1>, a paragraph reading "A list of key points:", and a bulleted list with two <li> items wrapped in a <ul>. The preview pane renders it as you would see it on a page, and the textarea below holds the raw HTML for pasting into a CMS, email template, or web file.
What this converter does and does not support
This is a deliberately lightweight converter that covers the most common Markdown: headings, bold, italic, inline and fenced code, links, images, horizontal rules, simple bullet lists, and paragraph breaks. It does not implement the full CommonMark or GitHub-Flavored Markdown specification. Features such as ordered lists, nested lists, tables, blockquotes, task checkboxes, and footnotes are outside its scope. For most notes, README snippets, and quick web copy that is exactly enough; for publishing a complex technical document with tables and nested structure, use a full Markdown processor.
Common mistakes and how to avoid them
- Forgetting blank lines. Paragraphs are created by blank lines. Two sentences on consecutive lines with no gap can merge; press Enter twice between paragraphs.
- Spaces inside emphasis markers. Write
**bold**, not** bold **. A space right after the asterisks breaks the match. - Expecting nested lists. Indented sub-bullets will not nest in this lightweight converter; keep lists flat or post-process the HTML.
- Pasting raw HTML expecting it to pass through. Because the tool escapes
<and>, any literal HTML you type appears as visible text, by design, to keep the output safe.
Practical use cases
Writers draft blog posts in Markdown and copy the HTML into a CMS. Developers preview a README before committing it. Support teams turn formatted notes into HTML email. Students convert study notes into clean web pages. Everything runs in your browser as you type — nothing is uploaded — so the conversion is instant and your draft stays private on your own device.