Zum Hauptinhalt springen

Markdown

Markdown ist eine einfache Auszeichnungssprache zum Formatieren von Text. Sie wird häufig für Dokumentationen, README-Dateien und Blogs eingesetzt, da sie leicht zu schreiben ist und sich gut in HTML umwandeln lässt. Plattformen wie GitHub erweitern die Standardsyntax um Funktionen wie Tabellen, Nachrichtenblöcke und Code-Highlighting. Auch Docusaurus, mit dem diese Webseite erstellt wurde, sowie die meisten GenAI-Chatbots verwenden Markdown.

Die folgenden Tools erleichtern das Arbeiten mit Markdown.

Textformatierungen

Text lässt sich in Markdown mit wenigen Sonderzeichen formatieren.

SyntaxErgebnis
*Text* oder _Text_Text
**Text** oder __Text__Text
***Text*** oder ___Text___Text
~~Text~~ oder ~Text~Text
<ins>Text</ins>Text
<sup>Text</sup>Text
<sub>Text</sub>Text
`Codezeile`Codezeile
:heart:❤️

Überschriften

Überschriften werden mit Rauten (#) eingeleitet. Die Anzahl der Rauten bestimmt die Hierarchieebene.

# Überschrift 1
## Überschrift 2
### Überschrift 3

Links werden mit [Anzeigetext](URL) erstellt, Abbildungen mit ![Alternativtext](URL).

[Markdown](https://de.wikipedia.org/wiki/Markdown)

![Alternativer Text](https://upload.wikimedia.org/wikipedia/commons/thumb/4/48/Markdown-mark.svg/208px-Markdown-mark.svg.png)

Listen

Markdown unterstützt ungeordnete Listen, geordnete Listen und Aufgabenlisten.

**Ungeordnete Liste**
- Java
- Python
- C++

**Aufgabenliste**
- [ ] Wäsche waschen
- [X] Zimmer aufräumen
- [ ] Rasen mähen

**Geordnete Liste**
1. Freiburg
2. Hamburg
3. Berlin

Tabellen

Tabellen werden mit senkrechten Strichen (|) und Trennzeilen aus Bindestrichen aufgebaut.

| Name | Alter | Geschlecht |
| ----- | ----- | ---------- |
| Hans | 27 | m |
| Lisa | 31 | w |
| Peter | 19 | m |

Codeblöcke

Codeblöcke werden mit drei Gravis (```) eingeleitet und abgeschlossen. Optional kann die Programmiersprache für Syntax-Highlighting angegeben werden.

```java
public class MainClass {
public static void main() {
System.out.println("Hello World");
}
}
```

Zitatblöcke

Zitatblöcke werden mit einem vorangestellten > eingeleitet.

> "C makes it easy to shoot yourself in the foot;
> C++ makes it harder, but when you do, it blows away your whole leg."
> (Bjarne Stroustrup)

Nachrichtenblöcke

Nachrichtenblöcke heben wichtige Informationen visuell hervor. GitHub und Docusaurus unterstützen unterschiedliche Syntaxvarianten.

**GitHub-Flavored-Markdown**

> [!NOTE]
> Ein einfacher Hinweis

> [!TIP]
> Ein hilfreicher Hinweis

> [!IMPORTANT]
> Ein wichtiger Hinweis

> [!WARNING]
> Eine Warnung

> [!CAUTION]
> Eine deutliche Warnung

**Docusaurus**

:::note[Hinweis]
Ein einfacher Hinweis
:::

:::tip[Tipp]
Ein hilfreicher Hinweis
:::

:::info[Info]
Eine einfache Information
:::

:::warning[Warnung]
Eine Warnung
:::

:::danger[Deutliche Warnung]
Eine deutliche Warnung
:::

Mermaid-Diagramme

Mit Mermaid lassen sich Diagramme direkt im Markdown-Code beschreiben und rendern. GitHub und Docusaurus unterstützen Mermaid nativ.

**Klassendiagramm**
```mermaid
classDiagram
Gender --o Person
class Gender {
<<enumeration>>
MALE, FEMALE, INTERSEX
}
class Person {
<<record>>
name: String
age: int
gender: Gender
}
```
**Flussdiagramm**
```mermaid
flowchart LR
a[a]
b{{b}}
c[/c/]
d(d)
a --> b
b --> c
c --> d
```
**Kuchendiagramm**
```mermaid
pie
"PS4" : 117
"XONE" : 58
"NSW" : 153
```
info

Mermaid ist eine Auszeichnungssprache, die es ermöglicht, Diagramme (z.B. Klassendiagramme und Flussdiagramme) aus Code zu erstellen.

Fußnoten

Fußnoten ermöglichen es, Quellenangaben oder ergänzende Hinweise ans Ende des Dokuments auszulagern.

Markdown [^1]

[^1]: Eine einfache Auszeichnungssprache (vgl. https://de.wikipedia.org/wiki/Markdown)

Horizontale Linien

Eine horizontale Linie wird durch drei aufeinanderfolgende Bindestriche (---) erzeugt.

---

Footnotes

  1. Eine einfache Auszeichnungssprache (vgl. https://de.wikipedia.org/wiki/Markdown)