HTML 목록 태그 - List Tags

HTML 목록 태그는 웹 페이지에서 항목을 나열할 때 사용하는 태그입니다. HTML에서는 세 가지 종류의 목록 태그를 사용할 수 있습니다.

<ul> 태그

<ul> 태그는 정렬되지 않은 목록을 생성합니다. 이 목록은 항목이 순서에 따라 정렬되지 않습니다. 각 항목은 원형 또는 정사각형 기호로 시작합니다.

 

다음은 <ul> 태그를 사용하여 정렬되지 않은 목록을 생성하는 예시입니다.

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

실제 웹 페이지에서는 다음과 같이 표시됩니다.

---

<ol> 태그

<ol> 태그는 정렬된 목록을 생성합니다. 이 목록은 항목이 순서에 따라 정렬됩니다. 각 항목은 숫자 또는 문자로 시작합니다.

 

다음은 <ol> 태그를 사용하여 정렬된 목록을 생성하는 예시입니다.

<ol>
  <li>첫 번째 항목</li>
  <li>두 번째 항목</li>
  <li>세 번째 항목</li>
</ol>

실제 웹 페이지에서 다음과 같이 표시됩니다.

---

<dl> 태그

<dl> 태그는 설명 목록을 생성합니다. 각 항목은 용어와 그에 대한 설명으로 구성됩니다. 각 용어는 <dt> 태그로 시작하고, 각 설명은 <dd> 태그로 시작합니다.

 

다음은 <dl> 태그를 사용하여 설명을 위한 목록을 작성하는 예시입니다.

    <dl>
      <dt>사과</dt>
      <dd>사과는 맛있어</dd>
      <dt>바나나</dt>
      <dd>맛있으면 바나나, 바나나는 길어</dd>
      <dt>기차</dt>
      <dd>길면 기차, 기차는 빨라</dd>
    </dl>

위 HTML 코드는 실제 웹 페이지에서 다음과 같이 표시됩니다.

---

List 태그는 웹 페이지에서 꽤나 많이 사용됩니다. 본문에서 설명을 보조하는 역할뿐만 아니라 사이드바나 푸터에서 게시글의 목록을 나열하거나 중요한 링크의 묶음을 구성하는데도 사용됩니다.