반응형
📝ol 태그
<!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>
<h3>라면 끓이는 방법</h3>
<ol type="A">
<li>물을 끓인다</li>
<li>라면과 스프를 넣는다</li>
</ol>
</body>
</html>
사진으로 이해하시면 편합니다.
📝ul 태그
<!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>
<h3>먹고 싶은 음식</h3>
<ul>
<li>감자탕</li>
<li>피자</li>
</ul>
</body>
</html>
ol태그와 다른 점은 마커 타입을 정할 수 없습니다. 하지만li을 쓴다는 공통점이 있습니다.
📝dl, dt, dd 태그
<!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>
<h3>웹 브라우저 종류</h3>
<dl>
<dt>Internet Explorer</dt>
<dd>
마이크로소프트에서 만든 브라우저로
현재 시장에서 가장 많이 사용한다.
</dd>
</dl>
</body>
</html>
사진으로 보시는 거와 같이 용어 설명과 같은 구조에서 자주 쓰입니다. <dl> 로 감싸주고, <dt> 는 용어이름, <dd> 세부내용입니다.
반응형
'[HTML && CSS] > [HTML]' 카테고리의 다른 글
[HTML] input태그 (0) | 2021.06.21 |
---|---|
[HTML] table(테이블) 태그 (thead, tbody, tfoot, tr, th, td) (0) | 2021.06.21 |
[HTML] div태그, span태그 (블록태그 , 인라인태그) (0) | 2021.06.21 |
[HTML] 텍스트 태그 <b>,<strong>,<i>,<del>,<ins>,<mark>,<sup>,<sub>,<small> [진하게, 강조, 이탤릭, 취소선, 밑줄, 하이라이팅, 윗첨자, 아랫첨자] (0) | 2021.06.21 |
[HTML] 특수기호 사용법 (0) | 2021.06.21 |