Front-End/HTML

[HTML] dl 태그, dt 태그, dd 태그

찐코딩 2021. 10. 26. 15:27

용어를 정의하고 용어를 설명하는 태그


<dl>태그는 definition list(정의 목록)의 약자로, 사전처럼 용어를 설명하는 목록을 만듦.

 

<dt>는  definition term(정의 용어)의 약자로, 정의되는 용어의 제목을 넣을 때 사용.

 

<dd>는  definition description(정의 설명)의 약자로, 용어를 설명하는 데 사용.

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>용어 관련 태그</title>
</head>
<body>

	<h3>용어 정의 목록</h3>	 
	
	<dl>
		<dt>키보드</dt>
			<dd>컴퓨터에 문자를 입력하는 장치이다.</dd>
			
		<dt>마우스</dt>
			<dd>화면의 커서를 요리조리 움직이고 버튼을 올려서 선택하는 장치이다.</dd>
		<dt>노트북</dt>
			<dd>가지고 다니면서 영화도 보고 웹 서핑도 하는 장치이다.
			<dd>작고 가벼운 컴퓨터이다.</dd>	
	</dl>
		 

</body>
</html>

<dd>를 사용하면 자동으로 들여쓰기가 되는 것을 볼 수 있다.