[11. 목록 태그(li,ul,ol)]

목록 태그(LI Tag)

li 태그는 목록을 나타낼 때 사용하는 태그이며, 부모 태그로 같이 사용하는 ui, ol 태그가 존재합니다.

 

 

※ 사용 방법 

<li>목록 이름</li>

 

태그 사용 시, 목록 이름 앞에 ● 특수문자가 붙어서 정렬됩니다.

 

 

 

 

부모 목록 태그(UL Tag)

li 태그의 부모 태그로, li 태그 간의 구분을 지을 때 사용합니다.

다른 부모 태그인 ol 태그와 다른 점은, 목록 앞에 순번이 없습니다.

 

 

※ 사용 방법 

<ul>

  <li>목록 이름</li>

</ul>

 

 

 

 

부모 목록 태그(OL Tag)

li 태그의 부모 태그로, li 태그 간의 구분을 지을 때 사용합니다.

ul 태그와 다른 점은, 목록에 번호를 붙여 정렬하므로 관리하기 용이합니다.

순번이 지정된 목록을 삭제 시, 다른 문장들의 번호를 재정리해서 표현합니다.

 

 

※ 사용 방법 

<ol>

  <li>목록 이름</li>

</ol>

 

태그 사용 시, 목록 이름 앞에 순번으로 정렬됩니다.

 

 

 

 

 

 

목록 태그 표현(LI)

 

li 태그를 사용해서 목록을 생성합니다.

 

 

목록이 생성된 것을 확인할 수 있습니다.

 

 

위 목록과 아래 목록을 구분 지을 때, 부모 태그인 ul, ol 태그를 사용하지 않으면 어떻게 될까요?

 

 

목록 간의 구분이 되지 않고, 하나의 목록으로 나오는 것을 확인할 수 있습니다.

이처럼 여러 개의 목록을 생성할 때는, 부모 태그를 사용해야 한다는 것을 알 수 있습니다.

 

 

 

 

 

 

목록 태그 표현(OL, UL)

 

목록 간의 구분을 짓기 위해, ul 태그를 사용합니다.

 

 

목록 간의 구분이 생긴 것을 확인할 수 있습니다.

 

 

ol 태그와 ul 태그의 차이점을 보기 위해 서로 다른 부모 태그를 사용해서 목록을 정렬합니다.

 

 

ol 태그를 사용할 시, ul 태그와는 다르게 기호 대신 순번이 정렬되어, 관리하기 편하다는 것을 알 수 있습니다.