HTML <summary> 태그
정의 및 특징
<summary> 태그는 <details> 요소에 의해 생성되는 대화형 위젯에서 기본적으로 보이는 제목을 정의할 때 사용합니다.
<summary> 요소는 반드시 <details> 요소의 첫 번째 자식 요소이어야 하며, 이 제목을 마우스로 클릭함으로써 <details> 요소를 보이도록 할 수도 있고 숨길 수도 있습니다.
<details> 요소는 사용자가 직접 조작하여 보거나 숨길 수 있는 부가적인 세부사항(additional details)을 명시할 때 사용합니다.
예제
<details>
<summary>오늘의 환율</summary>
<ul>
<li>달러($) : 1,135.90</li>
<li>유로(€) : 1,284.08</li>
<li>엔(￥) : 1,014.88</li>
</ul>
</details>
지원하는 브라우저 및 버전
| 태그명 |
|
|
|
|
|
|
|---|---|---|---|---|---|---|
| <summary> | 12.0 | 지원하지 않음 | 지원하지 않음 | 49.0 | 6.0 | 15.0 |
HTML5에서 변경된 사항
<summary> 태그는 HTML5에서 새롭게 추가된 요소입니다.
CSS 기본값
|
summary { display: block; } |
