HTML[HTML 리스트(List)]

HTML 리스트는 항목 목록을 나타내는 데 사용되는 태그입니다. 

 

리스트는 순서가 있는(ordered) 리스트와 순서가 없는(unordered) 리스트 두 가지 유형으로 구성됩니다.

순서가 있는 리스트는 ol 태그를 사용하며, 각 항목은 li 태그로 나타냅니다.

 

예를 들어, 순서가 있는 리스트로 1부터 3까지의 항목을 나열하려면 다음과 같은 코드를 작성할 수 있습니다.

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

1. 첫 번째 항목
2. 두 번째 항목
3. 세 번째 항목

순서가 없는 리스트는 ul 태그를 사용하며, 각 항목도 li 태그로 나타냅니다.

 

예를 들어, 순서가 없는 리스트로 여러 가지 과일을 나열하려면 다음과 같은 코드를 작성할 수 있습니다.

<ul>
  <li>사과</li>
  <li>바나나</li>
  <li>딸기</li>
</ul>

• 사과
• 바나나
• 딸기

순서가 있는 리스트와 순서가 없는 리스트의 항목을 서로 중첩하여 사용할 수도 있습니다. 

 

예를 들어, 순서가 있는 리스트 안에 순서가 없는 리스트를 사용하려면 다음과 같은 코드를 작성할 수 있습니다.

<ol>
  <li>첫 번째 항목</li>
  <li>두 번째 항목
    <ul>
      <li>안에 들어가는 순서 없는 리스트의 첫 번째 항목</li>
      <li>안에 들어가는 순서 없는 리스트의 두 번째 항목</li>
    </ul>
  </li>
  <li>세 번째 항목</li>
</ol>

1. 첫 번째 항목
2. 두 번째 항목
   • 안에 들어가는 순서 없는 리스트의 첫 번째 항목
   • 안에 들어가는 순서 없는 리스트의 두 번째 항목
3. 세 번째 항목

위 코드는 "첫 번째 항목", "두 번째 항목", "세 번째 항목"으로 이루어진 순서가 있는 리스트 안에

 

 "두 번째 항목" 내부에 순서가 없는 리스트가 포함되어 있는 구조입니다.

리스트를 사용하면 웹 페이지에서 다양한 항목을 표시하고 그룹화할 수 있습니다. 

 

또한, 리스트의 스타일을 변경하여 리스트를 더욱 시각적으로 다양하게 만들 수도 있습니다.