h13. HTML 리스트 태그

HTML 리스트 태그

HTML 리스트 기능중에 <ul>태그로 시작하고, 각 리스트 항목이 <li>태그를 갖으면, 해당 리스트 항목들의 맨 앞에 검은 점이 표시됩니다.

<ul>
<li>울산바위</li>
<li>흔들바위
<ul>
<li>등산 : 30분</li>
<li>하산 : 20분</li>
</ul>
</li>
<li>비선대</li>
</ul>
<ul style="list-style-type: square;">
<li>장승골</li>
<li>여우마실</li>
<li>구름마당</li>
</ul>
<ul style="list-style-type: circle;">
<li>오선지</li>
<li>수학노트</li>
<li>음악공책</li>
</ul>

• 울산바위
• 흔들바위
  • 등산 : 30분
  • 하산 : 20분
• 비선대

• 장승골
• 여우마실
• 구름마당

• 오선지
• 수학노트
• 음악공책

---

<ol> 태그로 시작하고 각 리스트 항목이 <li> 태그를 갖으면, 해당 항목의 맨 앞에 일련번호가 순차로 표시됩니다.

<ol>
<li>치와와</li>
<li>풍산개</li>
<li>바둑이</li>
</ol>
<ol type="1" start="101">
<li>치와와</li>
<li>풍산개</li>
<li>바둑이</li>
</ol>
<ol type="A">
<li>볼트</li>
<li>너트</li>
<li>나사</li>
</ol>
<ol type="a">
<li>감</li>
<li>밤</li>
<li>사과</li>
</ol>
<ol type="I">
<li>배추</li>
<li>단무지</li>
<li>겉절이</li>
</ol>
<ol type="i">
<li>롤리팝</li>
<li>마시멜로</li>
<li>넛 브레드</li>
</ol>

1. 치와와
2. 풍산개
3. 바둑이

101. 치와와
102. 풍산개
103. 바둑이

1. 볼트
2. 너트
3. 나사

1. 감
2. 밤
3. 사과

1. 배추
2. 단무지
3. 겉절이

1. 롤리팝
2. 마시멜로
3. 넛 브레드

---

<dl> 태그는 description list 를 의미하는데 용어별로 설명을 표시할 때 사용할 수 있습니다. 

<dt> 태그에 용어를 적고, <dd> 태그에 설명을 적습니다.

<dl>
<dt>IT: </dt><dd>information technology</dd>
<dt>BT: </dt><dd>bio technology</dd>
</dl>

IT:

information technology

BT:

bio technology

---

[광고] Udemy 동영상 강의로 보기