So nutzen Sie den Markdown-Editor
- Tippen Sie Markdown in den Editor auf der linken Seite oder fügen Sie es dort ein.
- Die Live-Vorschau aktualisiert sich beim Schreiben, dargestellt mit GitHub Flavored Markdown (GFM).
- Klicken Sie auf HTML kopieren, um das erzeugte HTML für eine Website, ein CMS oder eine E-Mail zu kopieren.
- Oder kopieren Sie das Markdown selbst für eine README, ein Issue, einen Pull-Request oder eine Dokumentationsseite.
Die Darstellung erfolgt in Ihrem Browser, und Ihr Text wird weder hochgeladen noch gespeichert. Das erzeugte HTML wird bereinigt, sodass Skripte und gefährliche Attribute in eingefügten Inhalten entfernt werden, bevor die Vorschau erscheint.
Was ist Markdown?
Markdown ist eine schlanke Auszeichnungssprache, die John Gruber 2004 entwickelt hat. Sie nutzt Satzzeichen aus reinem Text zur Formatierung: # für Überschriften, * oder _ für Hervorhebungen, - für Listen. Der Quelltext bleibt als reiner Text lesbar, und ein Renderer macht daraus HTML.
Die ursprüngliche Beschreibung ließ viele Sonderfälle offen, deshalb verhielten sich die Umsetzungen unterschiedlich. CommonMark ist eine ausführliche Spezifikation, die diese Mehrdeutigkeiten auflöst, und GitHub Flavored Markdown ist eine Obermenge von CommonMark mit Funktionen, die Entwickler täglich nutzen:
| GFM-Funktion | Syntax |
|---|---|
| Tabellen | | Name | Value | mit einer Trennzeile |---|---| |
| Aufgabenlisten | - [ ] todo und - [x] done |
| Durchgestrichen | ~~removed~~ |
| Automatische Links | Nackte URLs wie https://example.com werden zu Links |
| Abgegrenzte Codeblöcke (Fenced Code Blocks) | Drei Backticks, optional gefolgt von einem Sprachnamen |
Markdown-Spickzettel
# Heading 1
## Heading 2
**bold**, *italic*, `inline code`
- Bullet item
- Nested item (indent two spaces)
1. Numbered item
[Link text](https://example.com)
> A blockquote
```python
print("fenced code with a language")
```Häufige Markdown-Probleme und wie Sie sie beheben
Überschrift wird nicht dargestellt. CommonMark verlangt ein Leerzeichen nach den Rautenzeichen. #Title ist reiner Text; # Title ist eine Überschrift.
Zeilen werden zu einem Absatz zusammengezogen. Ein einfacher Zeilenumbruch innerhalb eines Absatzes wird als Leerzeichen behandelt. Lassen Sie eine Leerzeile, um einen neuen Absatz zu beginnen, oder beenden Sie eine Zeile mit zwei Leerzeichen oder einem Backslash für einen festen Zeilenumbruch. (GitHub-Kommentare behandeln einfache Zeilenumbrüche anders als README-Dateien, was häufig für Verwirrung sorgt.)
Liste oder Codeblock endet zu früh. Inhalt, der zu einem Listenpunkt gehört, muss so eingerückt sein, dass er mit dem Text des Punkts bündig ist. Für Code innerhalb einer Liste rücken Sie den gesamten abgegrenzten Codeblock ein:
1. Install the package:
```bash
npm install example
```
2. Run it.Tabelle wird nicht dargestellt. Eine GFM-Tabelle braucht eine Kopfzeile, eine Trennzeile mit mindestens drei Bindestrichen pro Spalte und meist eine Leerzeile davor. Mit Doppelpunkten in der Trennzeile (:---, :---:, ---:) richten Sie Spalten aus.
Ungewollte Formatierung. Zeichen wie *, _ und # können Formatierungen auslösen. Maskieren Sie sie mit einem Backslash, zum Beispiel \*not italic\*, oder setzen Sie sie in Backticks.
Tipps und Best Practices
- Geben Sie nach den öffnenden Backticks immer eine Sprache an, damit Codeblöcke, wo unterstützt, Syntaxhervorhebung erhalten.
- Schreiben Sie aussagekräftige Alternativtexte für Bilder; Screenreader lesen sie vor, und sie werden angezeigt, wenn das Bild nicht lädt.
- Schreiben Sie in langen Dokumenten einen Satz pro Zeile; Markdown fügt sie zu Absätzen zusammen, und Diffs werden viel übersichtlicher.
- Fügen Sie JSON- oder YAML-Beispiele zuerst in den JSON-Formatter oder YAML-Formatter ein, damit die Codeblöcke in Ihrer Dokumentation gültig und ordentlich sind.
- Wenn Sie das erzeugte HTML in eine Webseite einfügen, lassen Sie es durch den HTML-Formatter laufen, um es sauber einzurücken.
Häufig gestellte Fragen
Was ist der Unterschied zwischen Markdown und GitHub Flavored Markdown?
GFM ist eine von GitHub definierte Obermenge von CommonMark-Markdown. Es ergänzt Tabellen, Aufgabenlisten, Durchstreichen, erweiterte automatische Links und einige Einschränkungen für rohes HTML. Die meisten für GitHub geschriebenen READMEs werden hier genauso dargestellt.
Kann ich HTML in Markdown verwenden?
Ja, Markdown erlaubt eingebettetes HTML. Zur Sicherheit bereinigt die Vorschau die Ausgabe, sodass Tags wie <script>, Event-Handler-Attribute wie onclick und javascript:-Links entfernt werden.
Warum sieht mein Markdown auf einer anderen Website anders aus?
Plattformen nutzen verschiedene Markdown-Varianten und eigene Stylesheets. Die Grundsyntax (Überschriften, Hervorhebungen, Listen, Links, Code) ist einheitlich, aber Tabellen, Zeilenumbrüche und Erweiterungen wie Fußnoten oder Formeln unterscheiden sich je nach Renderer.
Wie wandle ich Markdown in HTML um?
Schreiben Sie Ihr Markdown oder fügen Sie es ein, prüfen Sie die Vorschau und klicken Sie dann auf HTML kopieren. Die Ausgabe ist schlichtes, semantisches HTML (Überschriften, Absätze, Listen, Tabellen) ohne Gestaltung und übernimmt so das CSS der Seite, in die Sie es einfügen.
Aktualisiert