HTML 목록

텍스트나 그래픽을 실린 상자 형태로, 이를 목록이라고 합니다. 목록의 가장 큰 특징은 정렬, 정돈, 순서입니다.

HTML은 정렬, 불순열 및 사용자 정의 목록을 지원합니다:

HTML 목록

온라인 예제

불순열 목록
이 예제에서 불순열 목록을 보여줍니다.

정렬된 목록
이 예제에서 정렬된 목록을 보여줍니다.

HTML 불순열 목록

불순열 목록은 항목의 목록으로, 이 목록 항목은 일반적으로 중간선 없는 작은 검은 원으로 표시됩니다.

불순열 목록은 <ul> 태그로 사용됩니다

<ul>
<li>목록 항목1</li>
<li>목록 항목2</li>
</ul>

브라우저에서 다음과 같이 표시됩니다:

• 목록 항목1

• 목록 항목2

HTML 정렬된 목록

또한, 정렬된 목록은 항목의 목록으로, 목록 항목은 숫자로 표시됩니다. 정렬된 목록은 <ol> 태그로 시작합니다. 각 목록 항목은 <li> 태그로 시작합니다.

목록 항목은 숫자로 표시됩니다.

<ol>
<li>목록 항목1</li>
<li>목록 항목2</li>
</ol>

브라우저에서 다음과 같이 표시됩니다:

1. 목록 항목1

2. 목록 항목2

HTML 사용자 정의 목록

사용자 정의 목록은 단순한 항목이 아니라, 항목과 주석의 조합입니다.

사용자 정의 목록은 <dl> 태그로 시작합니다. 각 사용자 정의 목록 항목은 <dt>로 시작합니다. 각 사용자 정의 목록 항목의 정의는 <dd>로 시작합니다.

<dl>
<dt>봄</dt>
<dd>-　봄이 와서 봄이 어디든 봄이 있습니다</dd>
<dt>가을</dt>
<dd>-　가을에 나무 잎이 노랗게 변했고, 가을은 수확의 계절입니다</dd>
</dl>

브라우저에서 다음과 같이 표시됩니다:

• 봄

• - 봄이 와서 봄이 어디든 봄이 있습니다

• 가을

• - 가을에 나무 잎이 노랗게 변했고, 가을은 수확의 계절입니다

주의사항 - 사용자가 좋아할 만한 팁

힌트: 목록 항목 내에서 문단, 개행 문자, 이미지, 링크, 다른 목록 등을 사용할 수 있습니다.

추가 예제

다양한 유형의 정렬된 목록
다양한 유형의 정렬된 목록을 보여줍니다.

다양한 유형의 불순열 목록
다양한 유형의 불순열 목록을 보여줍니다.

내포 목록
이 예제에서 목록을 내포하는 방법을 보여줍니다.

내포 목록 2
이 예제에서 더 복잡한 내포 목록을 보여줍니다.

사용자 정의 목록
이 예제에서 정의 목록을 보여줍니다.

HTML 목록 태그