<ol> ,<ul> 태그 처럼 리스트를 만들수 있는 태그 가 있습니다.
바로 <dl> 태그 입니다. <dl>태그는 description list 의 약자로 용어에 대한 설명을 리스트로 표현할 수 있는 태그 입니다.
<dl> 태그는 내부에 용어의 뜻을 나타내는 <dt> 와 그 용어의 세부설명인 <dd> 태그로 구성됩니다.
dt : description term. (설명 용어)
dd : description data (설명 내용)
으로 시맨택 태그의 본연의 의미를 내포하고 있습니다.
하기는 dl 태그 예제 입니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- description list -->
<dl>
<!-- description term -->
<dt>A조</dt>
<!-- description detail -->
<dd>AC밀란</dd>
<dd>맨유</dd>
<dd>바이른뮌헨</dd>
<dd>AS로마</dd>
<dt>B조</dt>
<dd>레알마드리드</dd>
<dd>파리생제르망</dd>
<dd>인터밀란</dd>
<dd>리버풀</dd>
</dl>
</body>
</html>위 예제의 결과 값은 하기와 같습니다.
잘 정돈된 리스트가 탄생되었습니다.
dl 태그를 사용하면 용어와 그 단어에 대한 설명을 부연 목록으로 만들 수 있습니다.
<dl>태그 예제를 살펴보았습니다.
감사합니다.
반응형
'앱 만들기 > HTML5' 카테고리의 다른 글
| 이미지를 표현해주는 태그 예제 (2) | 2023.03.03 |
|---|---|
| html 표 만들기 (4) | 2023.02.28 |
| <ul>태그 예제 (2) | 2023.02.26 |
| <ol> 태그 속성 (2) | 2023.02.19 |
| <ol> 태그 사용법 (4) | 2023.02.06 |
댓글