html을 배우면서 뭔가를 만들어지는 것이 신기하기도 하지만, 한편으로는 태그 하나 혹은 단어 하나만 틀려도 실행이 안돼서 짜증 나는 일이 많이 생길 것 같네요!
오늘은 태그 중에서 목록을 나타내는 태그! <ul>,<ol>,<dl>,<li>태그들이 어떻게 다른지 배웠습니다! 간단하고 재미있네요.. 아직은..ㅎ
목록을 나타내는 태그 <ul>,<ol>,<dl>,<li>태그
<Ul></Ul>: 'Unoerdered List'의 약자로 순서가 없는 목록 태그입니다. 글머리 기호를 붙여서 목록을 만드는 태그!
<Ol></Ol>: 'Ordered List'의 약자로 순서가 있는 목록 태그입니다. 번호 형식으로 순서를 매겨 목록을 만드는 태그!
<Dl></Dl>: 'definition List'의 약자로 정의 목록을 만드는 태그입니다. 어떤 용어의 정의를 나열하는 태그!
<Li></Li>: 'List Item"의 약자로 ul 태그와 ol 태그의 내부에서 사용되는 태그입니다. 목록의 내용이 되는 실질적인 태그!
<ul> 태그
글머리 기호를 붙여서 목록을 만드는 형식, <ul> 태그를 사용하면 ●의 모양으로 지정됩니다.
- <ul> 태그의 type을 변경: 아래의 type을 ""에 설정!
<ul type=""></ul>
-
disc: ●
-
circle: ○
-
square: ■
- <li> 태그의 type을 변경: 아래의 type을 ""에 설정!
<li type=""></li>
-
disc: ●
-
circle: ○
-
square: ■
<ol> 태그
순서가 있는 목록을 만드는 형식으로 type 지정이 없을 경우 1,2,3...으로 지정됩니다.
- <ol> 태그의 type을 변경: 아래의 type을 ""에 설정!
<ol type=""></ol>
-
1: 숫자 (1,2,3...)
-
A: 알파벳 대문자 (A, B, C...)
-
a: 알파벳 소문자 (a, b, c...)
-
i: 로마 숫자 (ⅰⅱⅲ...)
-
I: 로마숫자 (ⅠⅡⅢ...)
*start: <ol> 태그에 사용하며 시작 값을 임의로 지정할 때 사용합니다!
- <li> 태그의 type을 변경: 아래의 type을 ""에 설정!
<li type=""></li>
-
1: 숫자 (1,2,3...)
-
A: 알파벳 대문자 (A, B, C...)
-
a: 알파벳 소문자 (a, b, c...)
-
i: 로마 숫자 (ⅰⅱⅲ...)
-
I: 로마숫자 (ⅠⅡⅢ...)
* value: <li> 태그에 사용하며 해당 항목부터 순서 값을 변경할 때 사용!
<dl> 태그
용어에 대한 정의 목록을 만드는 태그!
-
<dt></dt>: 'Definintion term'의 약자로 용어의 제목을 나타내는 태그입니다. (줄 바꿈 기능이 있습니다.)
-
<dd></dd>: 'Definintion description'의 약자로 용어에 대한 설명을 나타내는 태그입니다. (줄바꿈 기능이 있습니다.)
'컴퓨터 언어 기초 > HTML' 카테고리의 다른 글
[HTML]띄어쓰기, 줄 변경하는 방법 (1) | 2020.04.10 |
---|---|
[HTML]이미지 넣는 방법&이미지 크기 변경 (0) | 2020.04.08 |
[html기초]테이블(table) 태그로 표 만들기! (0) | 2020.04.06 |
[html기초]header 태그와 font 태그 (0) | 2020.04.05 |
[html기초]HTML 문서 기본 틀 (0) | 2020.03.30 |