Markdownでコードブロックの中にバッククォート3つを書く方法

はじめに

この記事では、「Markdownでコードブロックの中にバッククォート3つを書く方法」について書いています。

Markdownでコードブロックの中にバッククォート3つを書きたいと思った時にやり方が分からず少し困ったのが記事を書いたきっかけでした。

自分に向けた備忘録の意味もありますが、「同じくMarkdownでコードブロックの中にバッククォート3つを書く方法を知りたい」な人の一助になれば嬉しいです。

要点だけ

  • Markdownでコードブロックの中にバッククォート3つを書く方法はいくつかある
    • インデントブロックを用いる
    • バッククォートを4つ使う
    • チルダを使う
    • HTMLのpreタグを使う
  • ただし環境やツールによっては使えないものがあるので注意すること

内容

Warning

マークダウンを記述する環境、ツールによっては上手く表示されないものがある点に注意ください 例えばQiitaでは、バッククォート4つやチルダの方法ではバッククォート3つをコードブロックの中で表示できないようです。

インデントブロックを用いる

マークダウンでコードブロックを書く方法として、バッククォート3つで囲む「フェンスドコードブロック」以外にも半角スペース4つのインデントで書く「インデントコードブロック」というものがあり、このインデントコードブロックを使うとバッククォート3つを書くことができます。

    ```python
    print("hello, world")
    ```

バッククォートを4つ使う

通常はバッククォート3つで囲みますが、4つで囲むと、バッククォート3つをコードブロックの中で表示することができます。

````
```python
print("hello, world")
```
````

この書き方は面白く、バッククォート4つを表示させるのは、バッククォート5つで囲むことで実現できます。

`````
````
```python
print("hello, world")
```
````
`````

チルダを使う

バッククォートの代わりにチルダ(~)3つで囲むと、その中でバッククォート3つを表示することができます。

~~~
```python
print("hello, world")
```
~~~

HTMLのpreタグを使う

HTMLのpreタグを使って表現する方法もあります。

<pre>
```python
print("hello, world")
```
</pre>

テキストの部分をコードブロックのように目立たせたいなら、preタグの中に更にcodeタグを使えば実現できます。

<pre><code>
```python
print("hello, world")
```
</code></pre>

おわりに

Markdownでコードブロックの中にバッククォート3つを書く方法」について解説しました。

さいごに、記事を書く上で参考にしたサイトのリンクを以下に掲載します。合わせて読んでいただくと良いかと思います。

qiita.com