JUST DO IT
[HTML] 리스트의 종류와 사용법 본문
HTML LIST 3가지 종류
1. 순서있는 리스트 (ordered list) : <ol></ol>
2. 순서없는 리스트 (unordered list) : <ul></ul>
3. 정의 리스트 (definition list) : <dl></dl>, <dt></dt>, <dd></dd>
* 리스트 아이템 : <li></li> (</li> 생략가능)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>라면을 끓이는 순서라고 합니다</title>
</head>
<body>
<h3>라면을 끓이는 순서</h3>
<hr>
<ol type="A"> <!-순서가 있는 ol 리스트-->
<li>물을 끓인다.</li>
<li>라면과 스프를 넣는다.</li>
<li>파를 썰어 넣는다.</li>
<li>5분 후 먹는다.</li>
</ol>
<hr>
<h3>내가 좋아하는 음식</h3>
<ul> <!-순서가 없는 ul 리스트-->
<li>감자탕</li>
<li>스파케티</li>
<li>올레국수</li>
</ul>
<hr>
<h3>내가 사는 이유</h3>
<ul>
<li>내가 좋아하는 음식 많아요
<ul>
<li>감자탕
<li>스파게티
<li>올레국수
</ul>
<li>라면 먹기 좋아해요
<ol type="1">
<li>물을 끓인다.
<li>라면과 스프를 넣는다.
<li>파를 썰어 넣는다.
<li>한 입에 다 먹는다.
</ol>
<li>여름에는 바다로
<li>가을에는 산으로
</ul>
</body>
</html>
'LANGUAGE > HTML' 카테고리의 다른 글
| [HTML] Visual Studio Code 줄 정렬 단축키 (0) | 2024.11.26 |
|---|---|
| VSCode에서 Live preview, Auto rename tag 설치하기 (0) | 2024.11.12 |
'LANGUAGE/HTML' Related Articles
more
