HTML - 목록 요소

무순서 목록(Unordered List) - <ul>

순서를 정하는 기호 대신 불릿(bullet) 기호로 표시하는 순서가 없는 목록이다.

기본적으로 <ul> 요소를 사용하며, 자식 요소로 <li> 를 사용해 내용을 넣는다.

 

주로 항목이 나열된 순서가 없거나 중요하지 않은 경우에 사용됩니다.

 

 

<ul>을 사용한 예시이다. 기본적으로 불릿 기호 앞에 내용이 입력된다.

 

 

불릿 기호는 "list-style-type"을 사용해서 변경할 수 있다.

• disc : 속이 채워진 원형 기호 (기본 값)
• circle : 속이 비워진 원형 기호
• square : 속이 채워진  사각형 기호
• none : 불릿 기호를 표시하지 않음

 

순서 목록(Ordered List) - <ol>

순서를 정하는 숫자, 영어, 로마어 등으로 표시하는 목록이다.

기본적으로 <ol> 요소를 사용하며, 자식 요소로 <li>를 사용해 내용을 넣는다.

 

항목의 순서가 중요할 때 사용됩니다. 단계나 순서가 있는 목록에 사용됩니다.

 

 

숫자 기호는 "list-style-type"을 사용해서 변경할 수 있다.

 

• decimal : 1,2,3...순으로 표기되며 기본값이다.
• lower-alpha : 소문자 알파벳인 a,b,c...순으로 표기된다.
• upper-alpha : 대문자 알파벳인 A,B,C...순으로 표기된다.
• lower-roman: 소문자 로마 숫자인 i, ii,iii...순으로 표기된다.
• upper-roman: 대문자 로마 숫자인 I,II,III... 순으로 표기된다.

 

정의형 목록(Definition List) - <dl>

문서 내에서 정의된 용어와 그 정의를 표현하는 데 쓰이는 목록이다.

기본적으로 <dl> 요소를 사용하며, 자식 요소로 <dt>과 <dd>를 사용해 내용을 넣는다.

 

 

• dt : 정의될 용어를 나타낸다.
• dd : 용어에 대한 정의를 나타낸다.