Markdown Spickzettel
Zuletzt aktualisiert
Überschriften
Setz ein Leerzeichen hinter die #-Zeichen. Die Anzahl der Zeichen bestimmt die Ebene, von 1 bis 6.
| Element | Markdown | Ergebnis |
|---|---|---|
| Überschrift 1 | # Page title | Überschrift der obersten Ebene, <h1> |
| Überschrift 2 | ## Section | Abschnittsüberschrift, <h2> |
| Überschrift 3 | ### Subsection | Unterabschnittsüberschrift, <h3> |
| Überschriften 4 bis 6 | #### Level 4
##### Level 5
###### Level 6 | <h4>, <h5> und <h6> |
| Überschrift 1, alternativ | Page title
========== | <h1>, dasselbe wie # Page title |
| Überschrift 2, alternativ | Section
------- | <h2>, dasselbe wie ## Section |
| Schließende Rauten | ## Section ## | <h2>Section</h2>; #-Zeichen am Ende fallen weg |
| Fehlendes Leerzeichen | #Not a heading | Ein normaler Absatz. Das Leerzeichen nach # ist Pflicht |
Fett, kursiv und durchgestrichen
Sternchen funktionieren überall, sogar mitten im Wort. Unterstriche funktionieren nur an Wortgrenzen, deshalb bleibt snake_case so, wie es getippt ist.
| Element | Markdown | Ergebnis |
|---|---|---|
| Fett | **bold text** | Fett, <strong>bold text</strong> |
| Fett, Unterstriche | __bold text__ | Fett, dasselbe wie oben |
| Kursiv | *italic text* | Kursiv, <em>italic text</em> |
| Kursiv, Unterstriche | _italic text_ | Kursiv, dasselbe wie oben |
| Fett und kursiv | ***bold and italic*** | <em><strong>bold and italic</strong></em> |
| Fett mitten im Wort | un**believ**able | Nur die Mitte des Wortes ist fett |
| Unterstriche im Wort | snake_case_name | Normaler Text, nicht kursiv |
| Durchgestrichen (GFM) | ~~no longer true~~ | Durchgestrichen, <del>no longer true</del> |
| Unterstrichen | <ins>underlined</ins> | Unterstrichener Text. Markdown hat keine Syntax zum Unterstreichen, deshalb ist das HTML |
| Hervorheben | <mark>highlighted</mark> | Hervorgehobener Text, wo die Plattform das Tag <mark> erlaubt. Markdown hat keine Syntax zum Hervorheben |
Zeilenumbrüche und Absätze
Einmal Enter innerhalb eines Absatzes beginnt in der Ausgabe keine neue Zeile. Nimm stattdessen eine dieser Varianten.
| Element | Markdown | Ergebnis |
|---|---|---|
| Neuer Absatz | First paragraph.
Second paragraph. | Zwei Absätze. Eine Leerzeile trennt sie |
| Umbruch: zwei Leerzeichen | Roses are red,
Violets are blue. | Ein Absatz mit einem <br> nach red,. Die erste Zeile endet mit zwei Leerzeichen, die man nicht sieht |
| Umbruch: Backslash | Roses are red,\
Violets are blue. | Dasselbe <br>, mit einem sichtbaren Zeichen. Funktioniert in CommonMark und auf GitHub |
| Umbruch: HTML | Roses are red,<br>Violets are blue. | Dasselbe <br>. Funktioniert auch in einer Tabellenzelle |
| Einfacher Zeilenumbruch | Roses are red,
Violets are blue. | Eine Zeile: Roses are red, Violets are blue. GitHub-Issues und Kommentare behalten den Umbruch, .md-Dateien nicht |
| Zusätzliche Leerzeilen | One.
Two. | Dasselbe wie eine Leerzeile. Für mehr Abstand setz <br> in eine eigene Zeile |
Listen
Rück einen verschachtelten Eintrag so ein, dass er mit dem Text des Eintrags darüber fluchtet: 2 Leerzeichen unter - , 3 Leerzeichen unter 1. .
| Element | Markdown | Ergebnis |
|---|---|---|
| Aufzählungsliste | - Apples
- Pears
- Plums | Eine Aufzählungsliste, <ul> mit drei <li> |
| Andere Aufzählungszeichen | * Apples
+ Pears | * und + erzeugen ebenfalls Aufzählungspunkte. Ein Wechsel des Zeichens beginnt eine neue Liste |
| Nummerierte Liste | 1. Install
2. Configure
3. Run | Eine nummerierte Liste, <ol> |
| Faule Nummerierung | 1. Install
1. Configure
1. Run | Trotzdem als 1, 2, 3 nummeriert. Nur die erste Zahl zählt |
| Bei einer Zahl beginnen | 7. Seventh
8. Eighth | <ol start="7">, ab 7 nummeriert |
| Verschachtelte Liste | - Fruit
- Apple
- Pear
- Vegetables | Eine Liste im ersten Eintrag |
| Verschachtelt, nummeriert | 1. Download
- Windows
- macOS
2. Install | Aufzählungspunkte in Schritt 1, um 3 Leerzeichen eingerückt |
| Absatz in einem Eintrag | - First item
More about the first item.
- Second item | Zwei Absätze im ersten Eintrag |
| Code in einem Eintrag | 1. Run this:
```bash
npm install
```
2. Start the app | Ein Codeblock in Schritt 1, bis zum Text des Eintrags eingerückt |
Aufgabenlisten (Checkboxen)
Eine Erweiterung von GitHub Flavored Markdown: Ein Listeneintrag, der mit [ ] oder [x] beginnt, wird zur Checkbox.
| Element | Markdown | Ergebnis |
|---|---|---|
| Leere Checkbox | - [ ] Write tests | Eine nicht angehakte Checkbox |
| Angehakte Checkbox | - [x] Write tests | Eine angehakte Checkbox. [X] funktioniert auch |
| Checkliste | - [x] Draft
- [ ] Review
- [ ] Publish | Ein angehaktes Kästchen und zwei leere. In GitHub-Issues und Pull Requests kannst du sie per Klick anhaken |
| Verschachtelte Aufgaben | - [ ] Release
- [x] Tag the commit
- [ ] Write the notes | Zwei Unteraufgaben unter dem ersten Kästchen |
| Fehlendes Leerzeichen | - [] Write tests | Ein normaler Aufzählungspunkt mit dem Text [] Write tests. Die Klammern brauchen ein Leerzeichen oder ein x |
Links
Der Linktext steht in eckigen Klammern, die Adresse direkt danach in runden Klammern, ohne Leerzeichen dazwischen.
| Element | Markdown | Ergebnis |
|---|---|---|
| Inline-Link | [Coddy](https://coddy.tech) | <a href="https://coddy.tech">Coddy</a> |
| Link mit Titel | [Coddy](https://coddy.tech "Learn to code") | Derselbe Link. Der Titel erscheint beim Überfahren mit der Maus als Tooltip |
| URL in spitzen Klammern | <https://coddy.tech> | Die URL selbst, als Link |
| Nackte URL (GFM) | https://coddy.tech | Ein Link auf GitHub und anderen GFM-Plattformen, die auch www.-Adressen verlinken. In striktem CommonMark normaler Text |
| E-Mail-Link | <hello@example.com> | Ein mailto:-Link |
| Referenz-Link | Read the [docs][1].
[1]: https://example.com/docs | docs verlinkt auf die URL. Die Zeile [1]: wird nicht angezeigt |
| Kurze Referenz | See [GitHub].
[GitHub]: https://github.com | GitHub verlinkt auf die URL |
| Relativer Link | [Install guide](docs/install.md) | Ein Link auf eine Datei relativ zu dieser. Auf GitHub öffnet er die Datei im Repository |
| Link auf eine Überschrift | [Jump to setup](#getting-started) | Scrollt auf derselben Seite zu ## Getting Started |
| Überschriften-IDs | ## Getting Started! | Bekommt auf GitHub die ID getting-started: Kleinbuchstaben, Leerzeichen werden zu Bindestrichen, Satzzeichen außer - und _ fallen weg |
| Überschrift in einer anderen Datei | [Requirements](docs/install.md#requirements) | Öffnet die Datei an dieser Überschrift |
| Leerzeichen in der URL | [Report](my%20report.pdf) | Schreib jedes Leerzeichen als %20 oder setz die URL in spitze Klammern: [Report](<my report.pdf>) |
| In neuem Tab öffnen | <a href="https://coddy.tech" target="_blank">Coddy</a> | Markdown hat dafür keine Syntax. Das HTML funktioniert dort, wo die Plattform das Attribut target beibehält |
Bilder
Ein Bild ist ein Link mit einem ! davor. Der Text in den eckigen Klammern wird zum Alternativtext, den Screenreader vorlesen.
| Element | Markdown | Ergebnis |
|---|---|---|
| Bild |  | <img src="cat.png" alt="A cat asleep on a sofa"> |
| Bild mit Titel |  | Dasselbe Bild mit einem Tooltip beim Überfahren mit der Maus |
| Bild von einer URL |  | Lädt das Bild aus dem Web |
| Verlinktes Bild | [](https://coddy.tech) | Ein Bild, das beim Anklicken den Link öffnet |
| Referenz-Bild | ![Logo][logo]
[logo]: images/logo.png | Dasselbe wie ein Inline-Bild, mit der URL einmal weiter unten definiert |
| Bildgröße | <img src="logo.png" alt="Logo" width="200"> | Das Bild, 200 Pixel breit. Einfaches Markdown hat keine Syntax für die Größe, deshalb ist das ein HTML-Tag <img> |
| Zentriertes Bild | <p align="center">
<img src="logo.png" alt="Logo" width="200">
</p> | Ein zentriertes Bild, wie in vielen README-Dateien auf GitHub |
Code und Codeblöcke
Backticks markieren Code innerhalb einer Zeile; ein Zaun aus drei Backticks markiert einen Block. Innerhalb von Code wird nichts formatiert.
| Element | Markdown | Ergebnis |
|---|---|---|
| Inline-Code | Run `npm install` first. | npm install in Festbreitenschrift, als <code> |
| Backtick in Code | ``Use `git` here`` | Der Code Use `git` here. Umschließ ihn mit mehr Backticks, als er selbst enthält |
| Codeblock | ```
npm install
npm run dev
``` | Ein Block, <pre><code>, mit erhaltenen Zeilenumbrüchen |
| Syntaxhervorhebung | ```python
def greet(name):
return f"Hello, {name}"
``` | Ein Python-Block mit farbiger Syntax. Gängige Namen: js, ts, python, bash, json, html, css, sql |
| Tilden-Zaun | ~~~js
console.log("hi");
~~~ | Dasselbe wie ein Zaun aus Backticks |
| Eingerückter Code | const total = 42; | Ein Codeblock durch 4 Leerzeichen Einrückung, nach einer Leerzeile |
| Diff-Block | ```diff
- const x = 1;
+ const x = 2;
``` | Auf GitHub entfernte Zeilen in Rot und hinzugefügte Zeilen in Grün |
| Zaun in einem Block | ````markdown
```js
let a = 1;
```
```` | Ein Block, der den inneren Zaun als Text zeigt. Der äußere Zaun braucht mehr Backticks als der innere |
Tabellen
Eine Erweiterung von GitHub Flavored Markdown. Die zweite Zeile, die Trennzeile, macht die erste Zeile zur Kopfzeile. Sie muss genauso viele Zellen haben wie die Kopfzeile, sonst entsteht keine Tabelle.
| Element | Markdown | Ergebnis |
|---|---|---|
| Tabelle | | Name | Role |
| ----- | ------ |
| Ada | Admin |
| Linus | Editor | | Eine Tabelle mit Kopfzeile und zwei Zeilen |
| Spaltenausrichtung | | Left | Center | Right |
| :--- | :----: | ----: |
| a | b | c | | Doppelpunkte legen die Ausrichtung fest: links, zentriert, rechts |
| Ohne äußere Pipes | Name | Role
--- | ---
Ada | Admin | Dieselbe Tabelle. Die Pipes am Anfang und Ende einer Zeile sind optional |
| Spaltenbreite | | a | b |
|---|---|
| 1 | 2 | | Die Breiten ergeben sich aus dem Inhalt. Die Anzahl der Bindestriche spielt keine Rolle, und die Pipes müssen nicht untereinander stehen |
| Formatierung in Zellen | | Command | Does |
| --- | --- |
| `git status` | Shows **changed** files | | Code, Fett, Links und Bilder funktionieren alle in Zellen |
| Pipe in einer Zelle | | Operator | Meaning |
| --- | --- |
| `a \| b` | a or b | | Die Zelle zeigt a | b. Maskier die Pipe als \|, auch innerhalb von Code |
| Zeilenumbruch in einer Zelle | | Step | Notes |
| --- | --- |
| 1 | First line<br>Second line | | Zwei Zeilen in einer Zelle. Ein echter Zeilenumbruch würde die Zeile beenden |
| Verbundene Zellen | <td colspan="2">Both columns</td> | Markdown-Tabellen können keine Zellen verbinden. Schreib die Tabelle in HTML mit colspan oder rowspan |
Zitate
Beginn jede Zeile mit >. Ein Zitat kann beliebiges anderes Markdown enthalten.
| Element | Markdown | Ergebnis |
|---|---|---|
| Zitat | > Simple is better than complex. | Ein eingerücktes Zitat, <blockquote> |
| Mehrere Absätze | > First paragraph.
>
> Second paragraph. | Ein Zitat mit zwei Absätzen. Die Zeile mit dem bloßen > hält sie zusammen |
| Verschachteltes Zitat | > The reply
>> The original message | Ein Zitat in einem Zitat |
| Andere Elemente darin | > #### Note
> - Back up first
> - Then upgrade | Eine Überschrift und eine Liste im Zitat |
| Hinweis (GitHub) | > [!NOTE]
> Requires Node 20 or later. | Ein farbiger Note-Kasten auf GitHub. Die anderen Typen sind [!TIP], [!IMPORTANT], [!WARNING] und [!CAUTION] |
Horizontale Linien
Drei oder mehr Bindestriche, Sternchen oder Unterstriche allein in einer Zeile ziehen eine Linie quer über die Seite.
| Element | Markdown | Ergebnis |
|---|---|---|
| Linie | --- | Eine horizontale Linie, <hr> |
| Andere Formen | ***
___ | Zwei weitere Linien |
| Linie nach Text | Some text
--- | Ein Absatz, dann eine Linie. Behalte die Leerzeile |
| Fehlende Leerzeile | Some text
--- | Eine Überschrift der Ebene 2, keine Linie: --- unter einer Textzeile unterstreicht sie |
Fußnoten
Unterstützt auf GitHub, GitLab und in vielen Static-Site-Generatoren. Striktes CommonMark kennt keine Fußnoten.
| Element | Markdown | Ergebnis |
|---|---|---|
| Fußnote | Markdown dates from 2004.[^1]
[^1]: John Gruber created it, with Aaron Swartz. | Eine hochgestellte 1, die auf die Anmerkung verlinkt; die Anmerkung steht unten auf der Seite |
| Benannte Fußnote | See the spec.[^spec]
[^spec]: https://spec.commonmark.org | Bezeichner können Wörter sein, die Anmerkungen werden trotzdem in der Reihenfolge der Verwendung mit 1, 2, 3 nummeriert |
| Wo man sie definiert | [^1]: The text of the note. | Die Definition kann irgendwo in der Datei stehen. Sie wird immer am Ende gerendert |
Zeichen maskieren (Escaping)
Ein Backslash vor einem Satzzeichen gibt das Zeichen selbst aus, statt zu formatieren.
| Element | Markdown | Ergebnis |
|---|---|---|
| Wörtliche Sternchen | \*not italic\* | Normaler Text mit den Sternchen: *not italic* |
| Wörtliche Raute | \# Not a heading | Ein Absatz, der mit # beginnt |
| Zahl mit Punkt | 2024\. A good year. | Ein Absatz, keine Liste, die bei 2024 beginnt |
| Wörtliche Klammern | \[not a link\](page.md) | Die eckigen und runden Klammern so, wie sie getippt sind |
| Wörtlicher Backtick | \` | Ein Backtick |
| Wörtlicher Backslash | \\ | Ein Backslash |
| Was sich maskieren lässt | \ ` * _ {} [] () <> # + - . ! | | Jedes ASCII-Satzzeichen. Ein Backslash vor einem Buchstaben oder einer Ziffer bleibt ein Backslash |
| HTML-Entitäten | © 2026 & <div> | © 2026 & <div>, als Text |
| Kein Escaping in Code | `*stars*` | Der Code *stars* so, wie er getippt ist. In Code ist ein Backslash ein gewöhnliches Zeichen |
HTML in Markdown
Die meisten Renderer reichen HTML durch, also deckt ein Tag ab, wofür Markdown keine Syntax hat. GitHub entfernt unsicheres HTML wie <script>, <style>, <iframe> und style-Attribute.
| Element | Markdown | Ergebnis |
|---|---|---|
| Tastaturtasten | Press <kbd>Ctrl</kbd> + <kbd>C</kbd> | Ctrl und C als Tasten dargestellt |
| Tief- und Hochstellung | H<sub>2</sub>O and x<sup>2</sup> | H₂O und x² |
| Ausklappbarer Abschnitt | <details>
<summary>Show the answer</summary>
The answer is **42**.
</details> | Ein Abschnitt, der sich per Klick öffnet. Die Leerzeilen sorgen dafür, dass das Markdown darin gerendert wird |
| Markdown in einem HTML-Block | <div>
**not bold**
</div> | **not bold** so, wie es getippt ist. In einem HTML-Block wird Markdown erst gelesen, wenn eine Leerzeile den Block beendet |
| Farbiger Text | <span style="color: red">red</span> | Roter Text auf Plattformen, die Inline-Styles erlauben. GitHub entfernt das Attribut style |
Kommentare
Markdown hat keine Syntax für Kommentare. Zwei Tricks halten Text von der gerenderten Seite fern.
| Element | Markdown | Ergebnis |
|---|---|---|
| Versteckter Kommentar | [//]: # (This line is never shown) | Nichts. Die Zeile ist eine Linkdefinition, die kein Link verwendet, und landet deshalb nie im HTML |
| Alternative Form | [comment]: <> (Also hidden) | Nichts, mit demselben Trick |
| HTML-Kommentar | <!-- TODO: add screenshots --> | Nichts auf der Seite, aber der Kommentar bleibt im HTML-Quelltext |
| Mehrzeiliger Kommentar | <!--
This whole block
is hidden
--> | Nichts auf der Seite |
| Platzierung | Some text.
[//]: # (comment)
More text. | Zwei Absätze. Vor der Kommentarzeile muss eine Leerzeile stehen, sonst erscheint sie als Text |
GitHub Flavored Markdown und GitHub-Extras
GitHub Flavored Markdown (GFM) ist CommonMark plus Tabellen, Aufgabenlisten, Durchstreichen und automatisch verlinkte URLs. GitHub legt noch mehr obendrauf.
| Funktion | Markdown | Wo es funktioniert |
|---|---|---|
| Tabellen | | a | b |
| --- | --- |
| 1 | 2 | | GFM: GitHub, GitLab und die meisten Dokumentationswerkzeuge |
| Aufgabenlisten | - [x] Done | GFM |
| Durchstreichen | ~~text~~ | GFM |
| Nackte URLs als Links | www.coddy.tech | GFM |
| Code mit Sprachangabe | ```js
let a = 1;
``` | CommonMark und GFM. Die Farben kommen von der Plattform |
| Fußnoten | Text.[^1]
[^1]: Note. | GitHub und GitLab, obwohl nicht in der GFM-Spezifikation |
| Emoji | :rocket: :tada: | GitHub und GitLab machen aus Shortcodes Emoji |
| Erwähnungen | @octocat | GitHub: verlinkt den Benutzer und benachrichtigt ihn |
| Issue-Links | #123 | GitHub: verlinkt Issue oder Pull Request 123 im selben Repository |
| Diagramme | ```mermaid
graph LR
A --> B
``` | GitHub und GitLab zeichnen ein Mermaid-Diagramm |
| Mathematik | $E = mc^2$
$$
\sum_{i=1}^{n} i
$$ | GitHub rendert LaTeX-Mathematik, inline zwischen $-Zeichen und als Block zwischen $$-Zeilen |
Die gesamte Markdown-Syntax auf einer Seite, jeweils neben dem, was daraus wird. Dieser Markdown-Spickzettel deckt die Grundsyntax ab (Überschriften, Hervorhebung, Zeilenumbrüche, Listen, Links, Bilder, Code, Zitate) und die Erweiterungen von GitHub Flavored Markdown: Tabellen mit Ausrichtung, Aufgabenlisten, Durchstreichen, automatisch verlinkte URLs und Fußnoten, dazu Escaping, HTML und Kommentare.
Die Beispiele folgen CommonMark und GitHub Flavored Markdown, den Regeln, auf denen GitHub, GitLab und die meisten Dokumentationswerkzeuge aufbauen. Wo sich eine Plattform anders verhält, steht es in der Zeile. Um ein Beispiel beim Tippen gerendert zu sehen, füg es in den Markdown-Editor ein.
FAQ zum Markdown-Spickzettel
Wie erstelle ich eine Tabelle in Markdown?
| Name | Role |, | --- | --- |, | Ada | Admin |. Doppelpunkte in der Trennzeile richten eine Spalte aus: :--- links, :---: zentriert, ---: rechts. Tabellen sind eine Funktion von GitHub Flavored Markdown und funktionieren deshalb auf GitHub, GitLab und in den meisten Dokumentationswerkzeugen, aber nicht in striktem CommonMark.Wie mache ich einen Zeilenumbruch in Markdown?
\) oder schreib <br>. Für einen neuen Absatz lass eine Leerzeile. GitHub-Issues und Kommentare sind die Ausnahme: Dort erscheint schon ein einzelner Zeilenumbruch als Umbruch.Wie schreibe ich einen Kommentar in Markdown?
[//]: # (your comment) in einer eigenen Zeile, mit einer Leerzeile davor, ist eine Linkdefinition, die nichts verwendet, und landet deshalb weder auf der Seite noch im HTML. Ein HTML-Kommentar, <!-- your comment -->, ist auf der Seite ebenfalls unsichtbar, bleibt aber im HTML-Quelltext, wo ihn jeder lesen kann, der sich den Quelltext ansieht.Wie erstelle ich einen Codeblock in Markdown?
```python, um Syntaxhervorhebung zu bekommen. Für Code mitten im Satz umschließ ihn mit einfachen Backticks: `npm install`.Wie füge ich eine Checkbox in Markdown ein?
[ ] für ein leeres Kästchen oder [x] für ein angehaktes: - [ ] Review oder - [x] Draft. Lass das Leerzeichen in den leeren Klammern stehen. Checkboxen gehören zu GitHub Flavored Markdown, und in GitHub-Issues und Pull Requests kannst du sie per Klick anhaken.Wie ändere ich die Größe eines Bildes in Markdown?
 zeigt das Bild immer in seiner eigenen Größe. Nimm stattdessen ein HTML-Tag wie <img src="image.png" alt="alt text" width="300">, das GitHub und die meisten Renderer akzeptieren. Setz nur die Breite oder nur die Höhe, damit die Proportionen erhalten bleiben.Wie verlinke ich in Markdown auf eine Überschrift?
# auf die ID der Überschrift: [Setup](#getting-started) springt zu ## Getting Started. GitHub bildet die ID aus dem Text der Überschrift in Kleinbuchstaben, wobei Leerzeichen zu Bindestrichen werden und Satzzeichen außer Bindestrichen und Unterstrichen wegfallen. Für eine Überschrift in einer anderen Datei setz die ID hinter den Dateinamen: [Setup](docs/install.md#getting-started).Was ist eine .md-Datei?
.md und .markdown sind die üblichen Endungen, und README.md ist die Datei, die GitHub auf der Startseite eines Repositorys anzeigt. Jeder Texteditor öffnet sie; GitHub, Dokumentationsseiten und Markdown-Viewer stellen sie als formatierten Text dar. Um eine Datei beim Bearbeiten gerendert zu sehen, füg sie in den Markdown-Editor ein.