HTML - 목록을 만드는 태그
HTML - 목록을 만드는 태그
이전글 :
HTML이란? - http://server-talk.tistory.com/1
HTML - 문법과 주의사항 - http://server-talk.tistory.com/102
HTML - 목록을 만드는 태그 |
목록을 만드는 태그 <ul> <ol> <li> 태그 사용합니다.
<ul> 태그 : Unoerdered List의 약자로 순서가 없는 목록, 글머리 기호를 붙혀서 목록을 만드는 형식입니다.
<ol> 태그 : Ordered List의 약자로 순서가 있는 목록, 번호 형식으로 순서를 매겨 목록을 만드는 형식입니다.
<dl> 태그 : Dfinition List의 약자로 정의의 목록을 만드는 형식, 어떤 용어의 정의를 나열하는 형식입니다.
<li> 태그 : List Item의 약자로 ul 태그와 ol 태그의 내부에서 사용되는 태그 , 목록의 내용이 되는 실질적인 태<>그이며 들여쓰기 및 줄바꿈 기능이 있고 type 속성으로 다양한 기호를 사용할 수 있다.
HTML - <ul> 태그 |
<ul>속성 : 글머리 기호를 붙혀서 목록을 만드는 형식
ul 태그의 type 속성 : 전체 항목에 대한 type을 설정합니다.
disc : ● circle : ○ square : ■
<li>속성
li 태그의 type 속성 : 해당 항목에 대한 type을 설정합니다.
disc : ● circle : ○ square : ■
예제)
<html> <head> <meta charset="utf-8"> <title>First create html document</title> </head> <body> <body> <li>ul 태그</li> <ul> <li type="square">글머리 기호를 붙혀서 목록을 만드는 형식</li> </ul> </body> </html>
HTML - <ol> 태그 |
<ol>속성 : 순서가 있는 목록을 만드는 형식
ol 태그의 type 속성 : 전체 항목에 대한 type을 설정합니다.
1 : 숫자 A : 아파벳 대문자 a : 알파벳 소문자 i : 로마숫자 i ii iii ㅣ : I II III
<li>속성
li 태그의 type 속성 : 해당 항목에 대한 type을 설정합니다.
1 : 숫자 A : 아파벳 대문자 a : 알파벳 소문자 i : 로마숫자 i ii iii ㅣ : I II III
예제)
<html> <head> <meta charset="utf-8"> <title>First create html document</title> </head> <body> <body> <li>ul 태그</li> <ol type="A"> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> </ol> <ol type="1"> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> <li >글머리 기호를 붙혀서 목록을 만드는 형식</li> </ol> </body> </html>
HTML - <dl> 태그 |
<dl>속성 : 용어에 대한 정의 목록을 만드는 형식
dt : definintion term 의 약자로 용어의 제목을 나타내는 태그이다. 줄바꿈 기능이 있다.
dd : definintion description의 약자로 용어에 대한 설명을 나타내는 태그이다. 줄바꿈 기능이 있다.
예제)
<html> <head> <meta charset="utf-8"> <title>First create html document</title> </head> <body> <body> <dl> <dt>HTML 자주 사용하는 태그</dt> <dd>dl 태그<br> 용어의 대한 정의 목록을 만드는 형식<br> dt태그는 줄바꿈 기능이 있다.</dd> </dl> </body> </html>