html기초 배우기 - 목록(리스트)작성 시 ul>li태그와 ol>li 태그 사용방법

목록(리스트)을 작성할 때 쓰는 태그에 대해 배워봅시다. 크게 2가지 정도가 있습니다. 순서가 있을 때와 순서가 없을 때 어떻게 나타내는지 알려드리겠습니다.

 

1. 순서가 있는 목록

이번 달 영화 순위와 같이 순서가 필요한 목록은 ol > li  태그를 사용해 주세요.

결과 화면

1. 분노의 질주
2. 크루엘라
3. 파이프라인
4. 보이저스
5. 굴뚝 마을의 푸펠

ol 태그 예제

 

2. 순서가 없는 목록

취미 종류, 좋아하는 음식 리스트 등.. 순서가 없는 목록에는 ul > li 태그를 사용해 주세요.

결과 화면

• 책 읽기
• 음악 감상
• 맛집 탐방
• 게임
• 영화감상

ul 태그 예제

 

목록(리스트)을 지정할 때 자주 쓰이는 태그로 [ ul > li ] 태그와 [ ol > li ] 태그를 연습해서 마스터해 보세요.