1. 목록 관련 태그 (ul, ol, dl)

✅ 목록 태그 개요

HTML에서 목록을 만들 때는 <ul>(순서 없는 목록), <ol>(순서 있는 목록), <dl>(정의 목록) 태그를 사용합니다.

비순차 목록 (Unordered List)

태그 설명 주요 속성 코드 예시
<ul> 순서 없는 목록을 생성 type (disc, circle, square) html <ul type="circle"><li>항목 1</li><li>항목 2</li></ul>
<li> 목록의 항목을 생성 type (개별 항목의 스타일 설정 가능) html <li type="square">항목 3</li>

✔️ 예제 코드

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>비순차 목록 예제</title>
</head>
<body>
    <h3>비순차 목록 예제</h3>
    <ul type="disc">
        <li>사과</li>
        <li>바나나</li>
        <li type="circle">포도</li>
    </ul>
</body>
</html>

순차 목록 (Ordered List)

태그 설명 주요 속성 코드 예시
<ol> 순서 있는 목록을 생성 type (1, A, a, I, i), start html <ol type="I" start="2"><li>항목 1</li></ol>
<li> 목록의 항목을 생성 value (항목의 순서를 지정) html <li value="5">항목 5</li>

✔️ 예제 코드

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>순차 목록 예제</title>
</head>
<body>
    <h3>순차 목록 예제</h3>
    <ol type="A" start="3">
        <li>첫 번째 항목</li>
        <li value="5">다섯 번째 항목</li>
        <li>세 번째 항목</li>
    </ol>
</body>
</html>

정의 목록 (Definition List)

태그 설명 주요 속성 코드 예시
<dl> 정의 목록을 생성 없음 html <dl><dt>HTML</dt><dd>HyperText Markup Language</dd></dl>
<dt> 정의할 단어 없음 html <dt>웹 개발</dt>
<dd> 단어의 설명 없음 html <dd>웹 사이트를 제작하는 기술</dd>

✔️ 예제 코드

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>정의 목록 예제</title>
</head>
<body>
    <h3>정의 목록 예제</h3>
    <dl>
        <dt>HTML</dt>
        <dd>웹 페이지를 구성하는 기본 언어</dd>
        <dt>CSS</dt>
        <dd>웹 페이지의 스타일을 지정하는 언어</dd>
        <dt>JavaScript</dt>
        <dd>웹 페이지의 동적 기능을 추가하는 언어</dd>
    </dl>
</body>
</html>

2. 링크 관련 태그 (a)

✅ 하이퍼링크 개요