목록을 나열하는 태그
비순차적 목록 태그 / 순차적 목록 태그 / 정의형 목록 태그 - 3가지의 목록형 태그가 있다
필요에따라 사용하면된다.
01. 비순차적 목록 (Unordered List)
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>
- 기본값으로 블록요소이며 점으로 목록을 표시한다.
<ul>
태그 = 부모태그 ,<li>
태그 = 자식태그로 둘이 한쌍으로 존재한다.<li>
태그는 목록(list)의 내용을 담는 태그이다.<li>
태그는 반드시<ul>
태그안에 감싸여 있어야한다.<li>
의 내용에 다른 태그를 써서 하이퍼링크를 걸거나 할때는 반드시<li>
태그 내부에 작성한다.
📍출력물
- list1
- list2
- list3
02. 순차적 목록 (Orderd List)
<ol>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ol>
<ol>
태그도 동일하게<li>
태그와 한쌍을 이룬다.- 숫자 목록이하는 것을 제외하면 나머지는 동일하다.
📍출력물
- list1
- list2
- list3
03. 정의형 목록 (Definition List)
<dl>
<dt>list1</dt>
<dd>이건 list1에 대한 설명이다.</dd>
<dt>list2</dt>
<dd>이건 list1에 대한 설명이다.</dd>
<dt>list3</dt>
<dd>이건 list1에 대한 설명이다.</dd>
</dd>
<dl>
태그는 위 두개의 목록 태그와 다르게<dt>, <dd>
태그들과 한쌍을 이룬다.<dt>
는 정의 제목(definition title)을 뜻하며<dd>
는 정의 내용(definition description)을 뜻한다.- 정의 내용은 정의 제목보다 들여쓰기가 되어 출력되는 것을 볼 수 있다.
📍출력물
- list1
- 이건 list1에 대한 설명이다.
- list2
- 이건 list1에 대한 설명이다.
- list3
- 이건 list1에 대한 설명이다.
</dd>
Tips.
사실 <ol>
태그는 거의 사용할 일이 없다고 보면된다.
가장많이 사용되는 목록태그는 <ul>
태그이다.
⭐️지난 포스팅에 이어서 html 문서에 정보들을 질서정연한 목록의 형태로 출력하는 태그들에 대해서 알아보았습니다.