[HTML] 목록 관련 태그

 

< 목록 관련 태그 >

 

<li></li> (list) : 가장 기본적인 목록을 나타내는 태그

 

<ul> </ul> (unordered list)	- 순서가 없는 목록 태그   - 불릿 기호 : 채워진 원, 빈 원, 네모 ... => 변경은 CSS로 가능
<ol> </ol> (ordered list)	- 순서가 있는 목록 태그   - type 속성을 이용해서 변경 가능 => 속성값 : 1(기본값), A, a, i, I(로마숫자)

 

<!-- 순서가 없는 목록 -->
<ul>
    <li>HTML 
        <ul>
            <!-- 목록 안에 목록을 넣을 수 있다.-->
            <li>글자 관련 태그</li> <!-- 후손요소 : 두 개 이상의 자식요소를 거칠 때-->
            <li>목록 관련 태그</li>
        </ul>
    </li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
</ul> 

<!-- 순서가 있는 목록 -->
<ol>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
    <!-- 순서있는 목록 태그는 기본적으로 1부터 시작하는 숫자값 -->    
</ol>

<ol type="i"> <!-- type="속성값"을 통해 형태 변경 가능 -->
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    <li>jQuery</li>
</ol>

<ol start="5"> <!-- start="속성값"을 통해 시작 숫자 변경 가능 -->
    <li>나는 5</li>
    <li>나는 6</li>
    <li>나는 7</li>
    <li>나는 8</li>
</ol>

 

 

< 설명 목록 태그 >

 

<dl></dl> : description list. 설명과 관련된 목록 태그

<dt></dt> : description term. 제목을 작성하는 태그. 중복 사용 가능

<dd></dd> : description description. 해당 설명을 작성하는 태그. 자동 들여쓰기. 중복 사용 가능