HTML - 문제 미리보기
문제 931
medium
설명 목록(description list)에서 용어를 정의하는 태그와 설명을 작성하는 태그는?
```html
-
<_____ >커피
<_____ >검은색 뜨거운 음료
A. ``, ``
B. ``, ` `
C. ``, ``
D. ``, `<detail>`
</div>
</div>
<div class="explanation">
<h3>정답: B</h3>
<div class="explanation-content">
설명 목록에서는 `<dt>` 태그로 용어(term)를 정의하고, `<dd>` 태그로 해당 용어에 대한 설명(description)을 작성합니다. 'dt'는 'description term', 'dd'는 'description definition'의 줄임말입니다. 이 구조는 용어사전, 정의 목록, Q&A 형태의 콘텐츠를 만들 때 매우 유용합니다. 하나의 `<dt>` 다음에 여러 개의 `<dd>`가 올 수도 있습니다.
</div>
</div>
<div class="navigation-buttons" style="margin-top: 2rem;">
<a href="/problems.html?subject=HTML" class="nav-btn primary" style="text-decoration: none; padding: 12px 24px; background: #00d4aa; color: white; border-radius: 6px; font-weight: 500;">
🎯 이 과목 문제 풀기
</a>
<a href="/" class="nav-btn" style="text-decoration: none; padding: 12px 24px; background: #f8f9fa; color: #333; border: 1px solid #ddd; border-radius: 6px; margin-left: 10px;">
🏠 홈으로 가기
</a>
</div>
<div style="margin-top: 2rem; padding: 1rem; background: #f8f9fa; border-radius: 6px; border-left: 4px solid #00d4aa;">
<h4 style="margin: 0 0 0.5rem 0; color: #00d4aa;">💡 학습 팁</h4>
<p style="margin: 0; color: #666; font-size: 0.9rem;">
이 문제를 포함한 HTML 과목의 모든 문제를 순차적으로 풀어보세요.
진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.
</p>
</div>
</div>
</main>
<script>
// 코드 하이라이팅 적용
document.addEventListener('DOMContentLoaded', function() {
if (window.Prism) {
Prism.highlightAll();
}
});
</script>
</body>
</html>