Zum Inhalt springen
MarkdownToHTML

Referenz

Markdown-Spickzettel

Jede zentrale Markdown-Konstruktion, das HTML, das sie erzeugt, und wie sie dargestellt wird. Die Beispiele werden zur Build-Zeit live mit derselben Engine wie der Konverter umgewandelt.

Überschriften

Ein bis sechs #-Zeichen.

Markdown

# Heading 1
## Heading 2
### Heading 3

HTML

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>

Dargestellt

Heading 1

Heading 2

Heading 3

Fett, kursiv und durchgestrichen

Durchgestrichen erfordert GFM.

Markdown

**bold**, *italic*, ***both***, ~~strikethrough~~

HTML

<p><strong>bold</strong>, <em>italic</em>, <em><strong>both</strong></em>, <del>strikethrough</del></p>

Dargestellt

bold, italic, both, strikethrough

Links

Inline, mit Titel und Autolinks.

Markdown

[Inline link](https://example.com)

[With a title](https://example.com "Example")

https://example.com

HTML

<p><a href="https://example.com">Inline link</a></p>
<p><a href="https://example.com" title="Example">With a title</a></p>
<p><a href="https://example.com">https://example.com</a></p>

Bilder

Wie ein Link, mit vorangestelltem !.

Markdown

![Site logo](/favicon.svg)

HTML

<p><img src="/favicon.svg" alt="Site logo"></p>

Dargestellt

Site logo

Ungeordnete Listen

Verwenden Sie -, * oder +. Zwei Leerzeichen einrücken zum Verschachteln.

Markdown

- Apples
- Oranges
  - Blood orange
- Pears

HTML

<ul>
  <li>Apples</li>
  <li>Oranges
    <ul>
      <li>Blood orange</li>
    </ul>
  </li>
  <li>Pears</li>
</ul>

Dargestellt

  • Apples
  • Oranges
    • Blood orange
  • Pears

Geordnete Listen

Zahlen müssen nicht fortlaufend sein.

Markdown

1. First
2. Second
3. Third

HTML

<ol>
  <li>First</li>
  <li>Second</li>
  <li>Third</li>
</ol>

Dargestellt

  1. First
  2. Second
  3. Third

Aufgabenlisten

GFM-Kontrollkästchen.

Markdown

- [x] Write the draft
- [ ] Publish it

HTML

<ul>
  <li><input checked="" disabled="" type="checkbox"> Write the draft</li>
  <li><input disabled="" type="checkbox"> Publish it</li>
</ul>

Dargestellt

  • Write the draft
  • Publish it

Blockzitate

Zeilen mit > voranstellen.

Markdown

> Simple is better
> than complex.

HTML

<blockquote>
  <p>Simple is better
  than complex.</p>
</blockquote>

Dargestellt

Simple is better than complex.

Inline-Code

In Backticks einschließen.

Markdown

Run `npm install` first.

HTML

<p>Run <code>npm install</code> first.</p>

Dargestellt

Run npm install first.

Eingebettete Codeblöcke

Für Hervorhebung eine Sprache nach dem öffnenden Zaun angeben.

Markdown

```js
const answer = 42;
```

HTML

<pre><code class="hljs language-js"><span class="hljs-keyword">const</span> answer = <span class="hljs-number">42</span>;
</code></pre>

Dargestellt

const answer = 42;

Tabellen

GFM. Doppelpunkte in der Trennzeile legen die Ausrichtung fest.

Markdown

| Name | Qty |
| ---- | --: |
| Tea  |   2 |
| Milk |  10 |

HTML

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th align="right">Qty</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Tea</td>
      <td align="right">2</td>
    </tr>
    <tr>
      <td>Milk</td>
      <td align="right">10</td>
    </tr>
  </tbody>
</table>

Dargestellt

Name Qty
Tea 2
Milk 10

Horizontale Linie

Drei oder mehr -, * oder _.

Markdown

Above

---

Below

HTML

<p>Above</p>
<hr>
<p>Below</p>

Dargestellt

Above


Below

Zeilenumbrüche

Zeile mit zwei Leerzeichen oder einem Backslash beenden, oder „Zeilenumbrüche als <br>“ aktivieren.

Markdown

First line\
Second line

HTML

<p>First line<br>Second line</p>

Dargestellt

First line
Second line

Escaping

Sonderzeichen mit Backslash maskieren.

Markdown

\*not italic\*

HTML

<p>*not italic*</p>

Dargestellt

*not italic*

Nicht in Core-Markdown enthalten

Fußnoten, Definitionslisten, Mathematik und Emoji-Shortcodes sind Erweiterungen, die dieser Konverter nicht verarbeitet. Rohes HTML in Ihrem Markdown wird unverändert durchgereicht, wenn HTML bereinigen deaktiviert ist, und bereinigt, wenn es aktiviert ist.