Velog <details> : 접기/펼치기 만들기

가만히있으세요·2022년 6월 11일
4
post-thumbnail

🥲 velog는 아직 지원하지 않아요

작성 중 미리보기 창에서는 접기/펼치기 기능이 잘 작동하는데, velog에서는 출간 시 접기/펼치기 기능이 적용되지 않는다고 한다.
그래도 적용될 미래 혹은 html에서 사용하기 위해 알아보도록 하자.

📍접기/펼치기

velogd에서 작동하지 않으므로, 이미지로 대체하였다.

날 눌러봐. 내가 펼쳐져볼게. 얍!

"한번 더 눌러봐 내가 없어져볼게. 얍!"

누르기 전

누른 후


📍코드

<details>
<summary>접기/펼치기</summary>

>"내가 없어져볼게 얍"
</details>

📍사용법

마크다운이 오래된 문법이다 보니? (2004년 3월 19일 발표)
접기/펼치기 기능이 만들어지지 않았다는게 정론.

Html5에서 해당 기능을 위한 <detail> 태그가 추가되었다. (2014년 10월 28일 발표)

summary 태그에 보여질 문자열을 입력하고.
마크다운을 입력할 경우 한칸 띄우고 입력하도록 한다.

<details>
<summary>접기/펼치기</summary>
<!-- 띄우기 -->
>"내가 없어져볼게 얍"
</details>

1개의 댓글

comment-user-thumbnail
2023년 6월 20일

벨로그에서 위 코드로 접기/닫기 되는건가요~? 저는 저것 마저두 안되는데 ^^;;;;

답글 달기