[HTML 기초 강좌] 5. 목록을 나타내는 ul 태그, ol 태그, dl 태그, li 태그

1. 목록을 나타내는 태그들

 

ul 태그 : Unoerdered List 의 약자로 순서가 없는 목록이다.

글머리 기호를 붙혀서 목록을 만드는 형식이다.

 

ol 태그 : Ordered List 의 약자로 순서가 있는 목록이다.

번호 형식으로 순서를 매겨 목록을 만드는 형식이다.

 

dl 태그 : Difinition List 의 약자로 정의 목록을 만드는 형식이다.

어떤 용어의 정의를 나열하는 형식이다.

 

li 태그 : List Item 의 약자로 ul 태그와 ol 태그의 내부에서 사용되는 태그이다.

목록의 내용이 되는 실질적인 태그이다.

들여쓰기 및 줄바꿈 기능이 있고 type 속성으로 다양한 기호를 사용할 수 있다.

 

 

1.1 ul 태그

글머리 기호를 붙혀서 목록을 만드는 형식이다.

- ul 태그의 type 속성 : 전체 항목에 대한 type을 설정한다.

disc :  ●

circle : ○

square : ■

- li 태그의 type 속성 : 해당 항목에 대한 type을 설정한다.

disc :  ●

circle : ○

square : ■

 

ex) ul태그.html

 

 

 

1.2 ol 태그

순서가 있는 목록을 만드는 형식이다.

- ol 태그의 type 속성 : 전체 항목에 대한 type을 설정한다.

1 : 숫자 (1, 2, 3 ... 기본)

A : 알파벳 대문자

a : 알파벳 소문자

i : 로마숫자 ⅰⅱⅲ ...

I : 로마숫자 ⅠⅡⅢ...

- start : ol 태그에 사용하며 시작값을 임의로 설정할 때 사용한다.

 

- li 태그의 type 속성 : 해당 항목에 대한 type을 설정한다.

1 : 숫자 (1, 2, 3 ... 기본)

A : 알파벳 대문자

a : 알파벳 소문자

i : 로마숫자 ⅰⅱⅲ ...

I : 로마숫자 ⅠⅡⅢ...

- value : li태그에 사용하며 해당 항목부터 순서값이 변경할 때 사용한다.

 

ex ) ol태그.html

1.3 dl 태그

용어에 대한 정의 목록을 만드는 형식이다.

- dt : definintion term 의 약자로 용어의 제목을 나타내는 태그이다. 줄바꿈 기능이 있다.

- dd : definintion description 의 약자로 용어에 대한 설명을 나타내는 태그이다. 줄바꿈 기능이 있다.

 

ex ) dl태그.html

 

 

저작자표시비영리변경금지

'language > html' 카테고리의 다른 글

[HTML 기초 강좌] 10. img map 태그  (0)	2016.01.18
[HTML 기초 강좌] 9. Table 태그  (0)	2016.01.18
[HTML 기초 강좌] 8. iframe과 target  (8)	2016.01.18
[HTML 기초 강좌] 7. 링크연결  (2)	2016.01.18
[HTML 기초 강좌] 6. img 태그  (8)	2016.01.18
[HTML 기초 강좌] 5. 목록을 나타내는 ul 태그, ol 태그, dl 태그, li 태그  (10)	2016.01.18
[HTML 기초 강좌] 4. hr 태그 ( 구분선, 수평선 )  (8)	2016.01.18
[HTML 기초 강좌] 3.문자 형태 태그와 문장 형식 태그  (0)	2016.01.18
[HTML 기초 강좌] 2. Header 태그와 Font 태그 연습  (4)	2016.01.18
[HTML 기초 강좌] 1. 기본 구조 및 BODY 태그 연습  (34)	2016.01.18
PRE / XMP / 그대로 표현 / 띄어쓰기 / 태그 설명 / 태그 무시 / 띄어쓰기 적용  (2)	2016.01.05