본문 바로가기
HTML

[HTML] 태그의 중첩과 목록(리스트)

by byeongoo 2019. 5. 2.

1. 리스트

각각의 항목들을 리스트로 표현해 보겠습니다. 이때 사용하는 태그가 <li>입니다.

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

실행 결과1

 

보통 이 <li> 태그는 혼자 사용되지 않습니다. <ul> 태그를 이용하여 그룹핑을 합니다. 여기서 알아두어야 할 것은 태그안에 태그가 있을 수 있다는 것 입니다. 또한 가독성을 높이기 위해서 보통 태그안에 태그들은 들여쓰기(띄어쓰기)를 해줍니다. 

<ul>
	<li>기술소개</li>
	<li>기본문법</li>
	<li>하이퍼텍스트와 속성</li>
	<li>리스트와 태그의 중첩</li>
</ul>

<ul>
	<li>최진혁</li>
	<li>최유빈</li>
	<li>한이람</li>
	<li>한이은</li>
</ul>

실행 결과2

 

만약, 이 리스트에 순서를 부여하고 싶다면 <ol>태그를 사용하면 됩니다. ol은 ordered list의 약자이고, ul은 unordered list의 약자입니다.

 

<ol>
	<li>기술소개</li>
	<li>기본문법</li>
	<li>하이퍼텍스트와 속성</li>
	<li>리스트와 태그의 중첩</li>
</ol>

<ul>
	<li>최진혁</li>
	<li>최유빈</li>
	<li>한이람</li>
	<li>한이은</li>
</ul>

실행 결과3

 

'HTML' 카테고리의 다른 글

[HTML] html table  (0) 2019.05.08
[HTML] html 태그(p, br, img)  (0) 2019.05.02
[HTML] html 문서의 구조  (0) 2019.05.02
[HTML] HTML 태그 속성  (0) 2019.05.02
[HTML] HTML 시작  (0) 2019.05.02