HTML - 태그의 중첩과 목록

태그의 조합을 이용해서 복잡한 문서를 여러가지 방법으로 표현하는 방법을 알아봅시다. 그리고 왜 중첩해서 태그를 사용해야 하는지 알아봅시다.

<ul>

<li>기술소개</li>

<li>기본문법</li>

<li>하이퍼텍스트와 속성</li>

<li>리스트와 태그의 중첩</li>

</ul>

<ul>

<li>미나리</li>

<li>이미남</li>

<li>나미남</li>

<li>너미남</li>

</ul>

"<ul>~</ul>" 안에 묶인 경우에는 그룹핑이 되는 효과를 줄 수 있다. 

"<li>~</li>"를 단독으로만 사용하는 경우에는 태그안에 내용들을 따로 구분할 수 없지만 ul태그와 중첩해서 사용할 시에는 구분해서 보여지게 표현할 수가 있다. 

아래와 같이 그룹핑이 되어서 표현된다. 

• 기술소개
• 기본문법
• 하이퍼텍스트와 속성
• 리스트와 태그의 중첩

• 미나리
• 이미남
• 나미남
• 너미남

시각적으로 표현하기 위해서 하위에 포함된 태그를 들여쓰기 해서 보여준다. 

순서가 있는 경우의 리스트의 경우 <ul>태그가 아닌, <ol>태그로 감싸주면 순서가 있는 리스트로 표현이 된다. 

li = list(리스트)

ol = ordered list(순서가 있는 리스트)

ul = unordered list(순서가 없는 리스트)

1. 기술소개
2. 기본문법
3. 하이퍼텍스트와 속성
4. 리스트와 태그의 중첩