목록

메뉴 및 데이터등 다수의 데이터를 출력할 수 있는 테그들을 학습합니다.

목록

목록은 동일한 유형의 데이터를 순차적으로 화면에 표시를 할 수 있는 방법입니다. 목록은 크게 2가지로 나누어 집니다.

  • 순서가 있는 목록
  • 순서가 없는 목록

리스트

순서형, 비순서형,

비순서형 목록 (Unordered List)

특징 li 마다 블릿이 제공됩니다. 연속적인 컨덴츠를 나열할때 용이합니다.

<ul>
    <li>상위</li>
    <li>하위</li>
    <li>악세사리</li>
</ul>

주의: ul 테그와 li 테그 사이에는 다른 요소의 테그를 삽입할 수 없습니다. li와 li 사이에도 다른 요소의 테그를 삽입할 수 없습니다.

중첩목록

li안에는 또다른 ul 목록을 넣을 수 있습니다.

목록이 중첩하게 되면 들여쓰기 형태로 표현이 됩니다.

순서형 목록 (Ordered List)

ol로 표시를 합니다.

<ol>
    <li>1일차 코스</li>
    <li>2일차 코스</li>
    <li>3일차 코스</li>
</ol>

중첩목록

<ol>
    <li>1일차 코스
        <ol>
            <li>오전 일정</li>
            <li>오후 일정</li>
        </ol>
    </li>
    <li>2일차 코스</li>
    <li>3일차 코스</li>
</ol>

병합중첩

ul 목록 서브로 ol 목록을 삽입하거나, ol 목록에서 ul 목록을 서브로 삽입할 수도 있습니다.


목록테그

데이터 목록을 출력합니다.

목록의 종류

html은 2가지 종료의 목록을 지원합니다. 순가 있는 목록, 순서가 없는 목록으로 구분됩니다.

목록은 요소 테그와 요소를 묽는 테그로 구분이 됩니다.

요소테그

리스트의 요소는 li 테그를 이용하여 생성합니다.

    <li>메뉴1</li>
    <li>메뉴2</li>

순서가 없는 목록

ul 태그를 사용하면 글머리에 기호가 붙은 목록이 생성됩니댜.

순서가 있는 목록

ol 태그를 시용하면 글머리에 숫자가 붙은 목록을 출력합니다.

정의목록

목록의 용어나 정의를 위하여 사용되는 테그 입니다.

테이블 과의 차이점

테이블도 목록과 같이 다수의 데이터 출력이 가능합니다.