HTML 목록

HTML 목록 HTML 목록은 웹 페이지에서 항목을 나열하고 구조화하는 용도로 사용됩니다. 목록은 정보를 체계적으로 정리하고 사용자에게 분명한 시각적 표현을 제공합니다. HTML에서 세 가지 주요 목록 유형이 사용됩니다: 순서가 있는 목록, 순서가 없는 목록, 정의 목록입니다. 순서가 있는 목록은 번호 또는 다른 순차적 표시 기호로 항목을 나열하는 데 사용됩니다. 순서가 없는 목록은 점, 대시 또는 원 같은 비순차적 기호로 항목을 나열합니다. 정의 목록은 용어와 해당 정의를 연결합니다. 이 세 가지 목록 유형은 페이지의 내용을 구조화하고 사용자가 쉽게 읽고 이해할 수 있도록 도와줍니다. 목록을 작성할 때는 적절한 목록 유형을 선택하고 목록 항목의 의미와 구조를 명확하게 전달해야 합니다.
  • ul태그 (순서가 없는 비순서형 목록을 생성할 때 사용) – li태그 사용
  • ol태그 (순서형 목록을 생성할 때 사용) – li태그 사용
  • dl태그 (정의형 목록을 만들 때 사용, 용어와 용어 설명을 나열한 형태) – dt태그, dd태그 사용

<예제코드> – ul태그

<!-- 형식 <ul>
          <li>목록 내용1</li>
          <li>목록 내용2</li>
           (중략)
          <li>목록 내용1</li>
          </ul> -->

<h1>판매 중인 과일<h1>
<ul>
    <li>바나나</li>
    <li>사과</li>
    <li>수박</li>
</ul>

<예제코드> – ol태그

<!--형식 <ol>
            <li>목록 내용 1</li>
            <li>목록 내용 2</li>
            (중략)
            <li>목록 내용 N</li>
            </ol> -->

<h1>오늘 할일</h1>
<ol>
    <li>html 복습</li>
    <li>java 복습</li>
    <li>springboot 복습</li>
</ol>

<예제코드> – dl태그

<!--형식 <dl>
            <dt>용어 1</dt>
            <dd>용어 설명 1</dd>
            (중략)
            <dt>용어 N</dt>
            <dd>용어 설명 N</dd>
            </dl> -->
<dl>
    <dt>HTML</dt>
    <dd>HTML은 Hyper Text Markup Language의 약자로 웹 문서의 구조를 설계하기 위한 목적으로 개발된 언어입니다.</dd>
</dl>
<dl>
    <dt>CSS</dt>
    <dd>CSS는 Cascading Style Sheets의 약자로 웹 문서를 꾸미기 위한 목적으로 개발된 언어입니다.</dd>
</dl>

댓글 남기기