[HTML/CSS] <ol>, <ul> 목록 태그만들기!!
[HTML/CSS] <ol>, <ul> 목록 태그만들기!!
|
흔히 카테고리나 목차 등을 나열 할 때 목록을 표현 하게되죠? 목록태그는 목록의 범위를 나타내는 목록 태그와, 목록의 각 항목을 나타내는 <li>태그가 함께 사용됩니다. 목록 태그는 순서가 있는 목록 <ol>과 순서가 없는 목록 <ul>이 있어요. |
|
|
|
|
<ol></ol> 순서가 있는 목록
|
태그 |
속성 |
속성값 |
비고 |
ol |
type |
표현값 |
1 / a / A / i / I, 기본값1 |
|
start |
번호 |
시작숫자 | |
li |
type |
표현값 |
1 / a / A / i / I, 기본값1 |
| value | 번호 | 시작숫자 |
|
순서가 있는 목록태그는 속성과 속성값을 모두 생략하고 작성할 수 있으며 번호 형식은 숫자를 기본으로 합니다. 번호 형식을 지정하려면 숫자"1"은 아라비아 숫자, 소문자"a"는 영어소문자, 대문자"A"는 영어대문자, 소문자아이"i"는 소문자로마자, 대문자아이"I"는 대문자로마자로 적용되요. <ol>에서 "type"을 지정하면 목록 전체에 적용되며, <li>에서 "type"을 지정하면 해당 목록만 적용이 된답니다. 또한, <ol>에서 "start"를 지정하면 첫 항목부터 번호가 지정되며, <li>에서 "value"를 지정하면 적용한 항목 부터 번호가 변경됩니다. |
<ul></ul> 순서가 없는 목록
|
태그 |
속성 |
속성값 |
비고 |
ul |
type |
머리기호 |
disc / circle / square, 기본값disc |
li |
type |
머리기호 |
disc / circle / square, 기본값disc |
|
순서가 없는 목록도 마찬가지로 속성과 속성값을 생략할 수 있으며 기본값은 "disc"로 검은 원 형태 입니다. "circle"은 속이 빈 원, "square"는 검은 사각형 이에요. |
< 연습하기 >
