-
HTML 순서 없는 목록 (`<ul>`)과 순서 있는 목록 (`<ol>`)
IT창고/HTML 2023. 7. 19. 12:54반응형HTML 순서 없는 목록 (
<ul>
)과 순서 있는 목록 (<ol>
)HTML에서는 순서 없는 목록과 순서 있는 목록을 생성하기 위해
<ul>
과<ol>
태그를 사용합니다. 이번 글에서는 각각의 목록 태그의 역할과 사용법에 대해 자세히 알아보겠습니다.순서 없는 목록 (
<ul>
) 태그순서 없는 목록은 목록 항목들 사이에 순서를 부여하지 않고 나열하는 데에 사용됩니다.
<ul>
태그는 시작 태그(<ul>
)와 종료 태그(</ul>
)로 이루어져 있으며, 각 항목은<li>
태그로 감싸집니다.아래는 순서 없는 목록의 사용 예시입니다:
<ul> <li>항목 1</li> <li>항목 2</li> <li>항목 3</li> </ul>
위의 예시에서는
- 태그로 순서 없는 목록을 생성하고, 각 항목을
- 태그로 감싸서 나열했습니다.
순서 있는 목록 (
<ol>
) 태그순서 있는 목록은 각 항목들에 번호나 순서를 부여하여 나열하는 데에 사용됩니다.
<ol>
태그는 시작 태그(<ol>
)와 종료 태그(</ol>
)로 이루어져 있으며, 각 항목은<li>
태그로 감싸집니다.아래는 순서 있는 목록의 사용 예시입니다:
<ol> <li>항목 1</li> <li>항목 2</li> <li>항목 3</li> </ol>
위의 예시에서는
<ol>
태그로 순서 있는 목록을 생성하고, 각 항목을<li>
태그로 감싸서 번호를 부여하여 나열했습니다.목록 타입 속성
목록 태그(
<ul>
,<ol>
)는 목록의 형식을 지정하는데 사용되는 몇 가지 속성을 가지고 있습니다. 목록 타입 속성을 사용하여 목록의 외관을 조절할 수 있습니다.- type 속성:
<ol>
태그에서 사용되며, 번호의 형식을 지정합니다. 기본값은 "1"로 아라비아 숫자를 사용합니다. 다른 값으로 "A" (알파벳 대문자), "a" (알파벳 소문자), "I" (로마 숫자 대문자), "i" (로마 숫자 소문자) 등을 사용할 수 있습니다. - start 속성:
<ol>
태그에서 사용되며, 시작하는 번호를 지정합니다. 기본값은 "1"입니다.
목록 타입 속성을 활용하여 순서 있는 목록의 형식을 변경하거나 시작 번호를 지정할 수 있습니다.
마무리
HTML의
<ul>
과<ol>
태그를 활용하여 순서 없는 목록과 순서 있는 목록을 생성할 수 있습니다. 각 목록은<li>
태그로 각 항목을 감싸서 나열합니다. 목록 타입 속성을 사용하여 목록의 외관을 조절할 수 있습니다. 이러한 목록 태그를 활용하여 웹 페이지의 구조를 체계적으로 정리하고 내용을 효과적으로 전달해보세요. 다음 글에서는 HTML의 다른 유용한 요소들에 대해 다루어보겠습니다. 기대해주세요!반응형