HTML Lists | 리스트

• list 태그는 3가지로 분류된다.

​

1) Unordered list (CSS로 꾸며서 홈페이지 목록 bar처럼 목록화 해줄 수 있음)

2) Ordered list

3) Description list

 

 

---

<Unordered list>

​

• Unordered list 태그는 <ul> 태그를 사용하고, list 안에 들어갈 각각의 아이템들은 <li> 태그를 사용하여 준다.
• Unordered list 는 default 값으로, bullets(작은 검정 동그라미) 서식이 붙게 된다.

​

• CSS로 List item Marker를 변경 할 수도 있다.
• list-style-type 특성을 사용 하면 된다. 종류는 아래와 같이 4가지가 있다.

 

- disc : 작은 블랙 동그라미(default 값)

- circle : 작은 흰색 동그라미 - 검정 테두리

- square : 작은 검정 네모

- none : 마크 없음

 

​

• 또한, 아래와 같이 리스트 안에 리스트도 둘 수 있다.

---

 

<Ordered list>

​

• Ordered list 는 <ol> 태그를 사용하고, list 안에 들어갈 각각의 아이템들은 <li> 태그를 사용하여 준다.
• Ordered list 는 default 값으로, numbering이 부여된다.

​

​

• <ol> 태그 안에서 type 속성을 이용하면, list item Marker를 변경 할 수도 있다.

 

- type="1" (숫자 : default값)

- type="A" (대문자)

- type="a" (소문자)

- type="I" (로마숫자 대문자)

- type="i" (로마숫자 소문자)

 

​

• Ordered list에 start countiong 번호를 특정 숫자에서 시작하고 싶다면,
• ​start 속성을 사용해서 나타낼 수 있다.

​

---

 

<Desciption list>

​

• Description list는 <dl> 태그로 대표되며,
• <dt> 태그는 용어(이름)을 정의하고,
• <dd> 태그는 각 용어를 설명한다.

---

 

​