HTML 자주 사용하는 태그 - <ul><ol><li>

HTML5

 

예전에는 HTML 페이지를 개발하면 테이블 태그를 많이 사용했는데,

요즘은 CSS를 적극 활용하고 목록 태그를 많이 사용한다.

 

UL (Unordered List)

 - 순서가 필요없는 목록을 표시한다.
 - 블록 요소이다. 상자처럼 수직으로 쌓인다.

순서 없는 목록 태그

순서 없는 목록 출력

 - CSS style 사용하여 불릿 변경

    disc (기본값): ●

    circle: ○

    square: ■

    none: 불릿 없음

순서 없는 목록 태그

순서 없는 목록 출력

 

OL (Ordered List)

 - 목록에 순서를 표시한다.

 - 블록 요소이다. 상자처럼 수직으로 쌓인다.

순서 있는 목록 태그

순서 있는 목록 출력

 - type 속성

    1: 숫자 (기본값)

    A: 대문자 알파벳

    a: 소문자 알파벳

    I: 대문자 로마 숫자

    i: 소문자 로마 숫자

OL 태그 type 속성

순서 있는 목록 출력

 

LI (List Item)

 - <UL> 혹은 <OL> 태그의 자식 요소로 사용한다.

 - 목록 내 각 항목을 나타낸다.

 - 블록 요소이다. 상자처럼 수직으로 쌓인다.

 

블록 요소가 기억나지 않는다면,

HTML 블록 요소 개념 잡기