テクめも

プログラミング関連のちょっとしたTipsなどを書いています。

markdownで記事を書くとき、コードを折りたたむ方法

はてなブログやQiitaでmarkdownで記事を書くとき、HTMLのdetailsタグを用いることで、コードなどを折りたたむことができます。 detailsタグの子要素にsummaryタグに、最初から表示させておく内容を書いておきます。

書き方

<details>
<summary>コードを見る</summary>
``` python
# Fizz Buzz
for i in range(1, 101):
    if i % 15 == 0:
        print("FizzBuzz")
    elif i % 3 == 0:
        print("Fizz")
    elif i % 5 == 0:
        print("Buzz")
    else:
        print(i)
```
</details>

実際の見え方

コードを見る

# Fizz Buzz
for i in range(1, 101):
    if i % 15 == 0:
        print("FizzBuzz")
    elif i % 3 == 0:
        print("Fizz")
    elif i % 5 == 0:
        print("Buzz")
    else:
        print(i)