Skip to content

Instantly share code, notes, and snippets.

@higuma
Last active September 14, 2022 06:19
Show Gist options
  • Save higuma/f1ef8bc5f9c60ec1c941d8406885dde6 to your computer and use it in GitHub Desktop.
Save higuma/f1ef8bc5f9c60ec1c941d8406885dde6 to your computer and use it in GitHub Desktop.

Markdownにおける<details>タグの使用

Markdownでも<details>を使い、折り畳みセクションを作成できる。

<details>
<summary>折り畳み記事</summary>
折り畳まれるコンテンツ
</details>
折り畳み記事 折り畳まれるコンテンツ

注意点

<summary>の内部にはMarkdownの書式設定が使えない。

<details>
<summary>**このタイトルは強調が効かない**</summary>
折り畳まれるコンテンツ
</details>
**このタイトルは強調が効かない** 折り畳まれるコンテンツ

また<summary>行の後には空行を入れた方が安全。例えば直後にリストアイテムを記述しても認識しない。

<details>
<summary>このリストは認識しない</summary>
* Foo
* Bar
</details>
このリストは認識しない * Foo * Bar

空行を入れれば認識する。

<details>
<summary>このリストは認識する</summary>

* Foo
* Bar
</details>
このリストは認識する
  • Foo
  • Bar

この他に表組みでも同様の現象が発生する。不要な空行は単に無視するので、常に入れておくのが間違いない。

ネスト

ネスト可能。

<details>
<summary>折り畳み記事</summary>
折り畳まれるコンテンツ。

<details>
<summary>ネストされたリスト</summary>

* Foo
* Bar
</details>

<details>
<summary>ネストされた表</summary>

| Key | Value |
| - | - |
| x | 1 |
| y | 2 |
</details>
</details>
折り畳み記事 折り畳まれるコンテンツ。
ネストされたリスト
  • Foo
  • Bar
ネストされた表
Key Value
x 1
y 2
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment