Skip to main content

Code-Blöcke erstellen und markieren

Gib Codebeispiele mit Fenced-Code-Blöcken frei, und aktiviere die Syntaxmarkierung.

Umgrenzte Codeblöcke

Um umgrenzte Codeblöcke zu erstellen, platzierst du dreifache Graviszeichen ``` vor und hinter dem Codeblock. Wir empfehlen, eine leere Zeile vor und nach den Codeblöcken einzufügen, damit die Rohformatierung besser lesbar ist.

```
function test() {
  console.log("notice the blank line before this function?");
}
```

Screenshot des gerenderten GitHub-Markdowns, der zeigt, wie dreifache Backticks dazu führen, dass ein Codeblock unformatiert gerendert wird. Der Block beginnt mit „function test() {.“

Tipp: Um die Formatierung in einer Liste beizubehalten, musst du darauf achten, die nicht umgrenzten Codeblöcke um acht Leerzeichen einzurücken.

Um dreifache Graviszeichen in einem umgrenzten Codeblock anzuzeigen, musst du sie in vierfache Graviszeichen einschließen.

````
```
Look! You can see my backticks.
```
````

Screenshot des gerenderten GitHub-Markdowns, der zeigt, wie vierfache Backticks dazu führen, dass dreifache Backticks um einen Codeblock herum sichtbar bleiben. Der Block lautet: „Schau! Die Backticks werden angezeigt.“

Wenn du häufig Codeausschnitte und Tabellen bearbeitest, profitierst du möglicherweise von der Aktivierung einer Schriftart mit fester Breite in allen Kommentarfeldern auf GitHub Enterprise Cloud. Weitere Informationen finden Sie unter Informationen zum Schreiben und Formatieren bei GitHub.

Syntaxhervorhebung

Du kannst einen optionalen Sprachkennzeichner hinzufügen, um die Syntaxmarkierung im Fenced-Code-Block zu aktivieren.

Die Syntaxhervorhebung ändert die Farbe und den Stil des Quellcodes, damit er leichter lesbar ist.

So sieht z. B. die Syntaxmarkierung des Ruby-Codes aus:

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```

Dadurch wird der Codeblock mit Syntaxhervorhebung angezeigt:

Screenshot mit drei Zeilen Ruby-Code, wie er in GitHub angezeigt wird. Elemente des Codes werden in lilafarbener, blauer und roter Schrift dargestellt, um die Zeilen übersichtlicher zu gestalten.

Wir verwenden Linguist zum Ausführen der Spracherkennung und zum Auswählen von Grammatiken von Drittanbietern für die Syntaxhervorhebung. Die gültigen Schlüsselwörter findest du in der YAML-Datei der Sprache.

Erstellen von Diagrammen

Du kannst auch Codeblöcke verwenden, um Diagramme in Markdown zu erstellen. GitHub unterstützt Mermaid-, GeoJSON-, TopoJSON- und ASCII STL-Syntax. Weitere Informationen findest du unter Erstellen von Diagrammen.

Weitere Informationsquellen