Markdown에서 접기/펼치기(details) 사용하기
접기/펼치기란?
위키나 여러 문서들을 보면 아래와 같이 클릭하면 숨겨져 있는 내용이 보이게 작성되어있는 경우가 많다.
접기/펼치기
## 접은 제목 접은 내용사용법
HTML5에서부터 추가된 <details
태그를 이용하면 마크다운에서도 접기/펼치기를 사용 가능하다.
마크다운이 오래된 문법이다보니 해당 기능을 지원하지 않아서, HTML 태그를 마크다운 문법에 직접 적용하면 된다.
1
2
3
4
5
6
7
8
9
10
11
## 접기 시작
<details>
<summary>접기/펼치기</summary>
<!-- summary 아래 한칸 공백 두어야함 -->
## 접은 제목
접은 내용
</details>
## 접기 끝
접기 시작
접기/펼치기
## 접은 제목 접은 내용접기 끝
주의사항
summary
태그 아래 한칸 공백을 두어야한다.- 공백을 두지 않으면 Markdown 문법이 접은 부분에 적용되지 않는다.
- jekyll chirpy 테마에서는 잘 적용되지 않는 것처럼 보인다.