Markdown-Vorschau
Vorschau von Markdown als gerendertes HTML
Hello, Markdown
A quick bold word and some italics.
- Bullet one
- Bullet two
- Nested
- Bullet three
const greeting = 'hello world';
console.log(greeting);
Block quotes work too.
| Col A | Col B |
|---|---|
| 1 | 2 |
| 3 | 4 |
Welche Markdown-Varianten werden unterstützt?
Die Vorschau verwendet den `marked` Parser, der für GitHub-Flavored Markdown (GFM) konfiguriert ist: Tabellen mit `|`-Trennzeichen, eingezäunte Codeblöcke mit ```-Markierungen und Sprachhinweisen, Autolinks für URLs, Aufgabenlisten-Checkboxen (`- [ ]`), und Durchstreichungen mit `~~text~~`.
Die HTML-Ausgabe wird vor dem Rendern sanitisiert, sodass das Einfügen von nicht vertrauenswürdigem Markdown keine Skript-Tags oder Stylesheets in Ihren Browser injizieren kann. Wenn Sie rohe, nicht sanitisiertes HTML benötigen, verwenden Sie einen dedizierten Parser lokal.
Anwendungsfälle
- Vorschau von README vor dem Commit — sehen, wie GitHub Überschriften, Codeblöcke und Listen rendert.
- Dokumentation entwerfen — API-Dokumente in Markdown schreiben und das Format vor dem Einfügen in Notion oder ein Wiki überprüfen.
- Newsletter-Beiträge verfassen — in Markdown schreiben und die Vorschau für Substack oder Beehiiv vor dem Einfügen anzeigen.
- Formatierung von Stack Overflow-Antworten — Vorschau von Codeblöcken, Listen und Links vor dem Einreichen.
Beispiele
# Title
**bold** and *italic* text.
- list item
- another<h1>Title</h1>
<p><strong>bold</strong> and <em>italic</em> text.</p>
<ul><li>list item</li><li>another</li></ul>Häufig gestellte Fragen
Welche Markdown-Erweiterungen werden unterstützt?
GitHub-Flavored Markdown: Tabellen, eingezäunte Codeblöcke, Autolinks, Aufgabenlisten, Durchstreichungen. Fußnoten und Hinweise werden nicht unterstützt.
Ist HTML innerhalb von Markdown erlaubt?
Ja, aber die Ausgabe wird sanitisiert — `<script>`, `<style>` und on-event Attribute werden vor dem Rendern entfernt.
Kann ich das gerenderte HTML exportieren?
Verwenden Sie die Quellansicht Ihres Browsers oder DevTools, um das gerenderte HTML zu kopieren. Klicken Sie mit der rechten Maustaste auf die Vorschau und 'Frame-Quelle anzeigen', wenn verfügbar.
Sind Codeblöcke syntaxhervorgehoben?
Nein — eingezäunte Codeblöcke werden mit Monospace-Stil gerendert, aber ohne Sprachfarbhervorhebung. Fügen Sie einen Markdown-Prozessor wie `markdown-it` + `highlight.js` lokal hinzu, um das zu erreichen.
Wird die Eingabe an einen Server gesendet?
Nein. Parsing und Rendering erfolgen in Ihrem Browser.