Web/HTML5
HTML(11) <details>와 <summary> 활용
공판다2
2020. 11. 3. 17:38
1. 시맨틱 블록 태그
1) <details>와 <summary>
2. 시맨틱 인라인 태그
1) <mark> - 중요한 텍스트임을 표시
2) <time> - 시간 정보임을 표시
3) <meter> - 주어진 범위나 %의 데이터 양 표시
4) <progress> - 작업의 진행 정도 표시
[ 코드 ]
<!DOCTYPE html>
<head>
<title>details와 summary 태그</title>
</head>
<body>
<h3>details와 summary 태그</h3>
<details>
<summary>질문</summary>
<p>라면을 끓일 때 제일 먼저 해야하는것은?</p>
</details>
<details>
<summary>정답</summary>
<p>물을 먼저 넣는다.</p>
</details>
</body>
</html>
[ 실행 화면]
