정의 목록 구현 dl, dt, dd 태그 설명 - html 기초 배우기

dl, dt, dd 요소를 이용하여 정의 목록을 구현해보도록 하겠습니다.

 

각 태그에 대한 설명

• <dl> 태그 : 용어를 설명하는 목록을 만들 때 사용합니다. <dt><dd>로 구성할 수 있습니다.
• <dt> 태그 : 용어의 제목입니다.
• <dd> 태그 : 용어를 설명글입니다.

 

기본 구성은 아래와 같습니다.

<dl>
    <dt> 용어의 제목 </dt>
    <dd> 용어의 설명 </dd>
</dl>

 

적용 화면

 

예제

<dl>
    <dt> 라거 맥주 </dt>
    <dd> 라거 맥주란? 에일에 비해 알코올 도수가 낮은 편이고 시원한 청량감을 가지고 있다. </dd>
    <dt> 에일맥주 </dt>
    <dd> 에일맥주란? 라거보다 알코올 도수가 높고 색깔과 맛, 향이 라거보다 진한 편이다. </dd>
</dl>

정보출처 - 네이버 지식백과

 

 

<dl> 태그 안에는 <dt>와 <dd>를 중복 사용하여, 여러 용어를 설명할 수 있습니다.