Skip to main content

コードブロックの作成と強調表示

コードのサンプルをコードブロックにし、構文を強調表示して共有しましょう。

コードブロック

三連バッククォート ``` をコードのブロック前後に入力すると、コードブロックを作成できます。 ソースコードを読みやすくするために、コードブロックの前後に空の行を入れることをお勧めします。

```
function test() {
  console.log("この関数の前に空白行があるのがわかりますか?");
}
```

表示されたコードブロック

ヒント: リスト内でフォーマットを保持するために、フェンスされていないコードのブロックをスペース 8 つでインデントしてください。

To display triple backticks in a fenced code block, wrap them inside quadruple backticks.

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

Rendered fenced code with backticks block

If you are frequently editing code snippets and tables, you may benefit from enabling a fixed-width font in all comment fields on GitHub Enterprise Server. For more information, see "Enabling fixed-width fonts in the editor."

構文の強調表示

言語識別子を追加して、コードブロックの構文を強調表示することができます。

たとえば、Ruby コードの構文を強調表示するには:

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

Ruby の構文を強調して表示されたコードブロック

構文強調表示のための言語検出の実行やサードパーティの文法の選択には Linguist を使用します。 どのキーワードが有効かについては言語 YAML ファイルでご覧いただけます。

参考リンク