[HTML] List 사용하기 (😁 버킷리스트)

목표: HTML에서 List를 사용해보자

요약

1. Unordered lists
2. Ordered lists
3. Description lists

 

 

 

리스트(list <li> </li>)에도 다양한 종류가 있다.

Name	Tags	Description
Unordered lists	<ul> <li> </li> </ul>	순서 없어, 글머리 기호있어
Ordered lists	<ol> <li> </li> </ol>	순서 있어, 번호 매기기 있어
Description lists	<dl> <dt> </dt> <dd> </dd> </dl>	순서 없어, 글머리, 번호 없어, 대신 들여쓰기 있어

 

1. Unordered lists

 

구조: unordered list > lists

 

 

 

---

 

글머리 기호 바꾸고 싶어!

 

 

글머리 기호랑, 글머리 기호가 달린 리스트는 영어로 뭐라고 하게?

bullet, bulleted list

콩글리시 만들생각하지말구 외워주길 바란다.

 

 

글머리 기호를 그림으로 하고싶어!!

 

html문서와 같은 경로에, bullet image로 사용할 이미지를 넣었다.

header > style 에 지정한다.

에뿌네

---

 

 

2. Ordered lists

unordered lists와 사용법이 같다.

 

숫자 바꿔보고 싶지? 🤪

header > style에 classname(lower_alpha, lower_greek)으로 스타일을 구분한 다음

 

class를 지정해 주면

 

3. Description lists

Tags	Description
dl	Definition Lisis
dt	Definition Terms
dd	Definition Description

---