웹 페이지의 목록(List)에는 순서없는 목록과 순서 목록 두 가지가 있습니다. 순서없는 목록에서는 ≶ul>
과 ≶li> 태그를 사용하고 순서 목록에서는 ≶ol>과 ≶li> 태그를 사용합니다.
■ 순서없는 목록 : <ul>과 <li> 태그
순서없는 목록(Unordered List)은 다음의 실행 결과에서와 같이 목록 각 항목의 글 머리 기호가 점(·)으로 표현됩니다.
순서없는 목록 : <ul>, <li>
ex4-3.html
<h2>웹이란?</h2> <ul> <li>웹은 거미줄을 의미하는데 WWW(World Wide Web)의 약어</li> <li>인터넷과 웹 브라우저를 통하여 정보를 사용자에게 제공</li> <li>웹 브라우저를 통하여 원격에 있는 사용자와 상호 간에 소통</li> <li>웹 관련 직업 : 웹 디자이너, 웹 퍼블리셔, 웹 프로그래머</li> </ul>
ex4-3.html의 실행 결과
■ 순서 목록 : <ol>과 <li> 태그
순서 목록(Ordered List)은 다음의 실행 결과에서와 같이 목록 각 항목의 순서를 의미하는 일련번호가 붙게 됩니다.
순서 목록 : <ol>, <li>
ex4-4.html
<h2>라면 맛있게 끓이는 법</h2> <ol> <li>종이컵 3컵 분량의 물을 넣어 준다.</li> <li>수프를 면보다 먼저 넣고, 물이 끓으면 면을 넣는다. </li> <li>면을 젓가락으로 들어 올려주면서 끓인다.</li> <li>처음부터 끝까지 센 불을 유지해야 한다.</li> </ol>
ex4-4.html의 실행 결과
■ 정의 목록 : <dl>, <dt>, <dd> 태그
정의 목록(Definiton List or Description List)은 각각의 항목을 정의하는 형태를 가집니다. 다음 예제를 통하여 정의 목록에 대해 알아봅니다.
정의 목록 : <dl>, <dt>, <dd>
ex4-5.html
<h2>고양이 품종</h2> <dl> <dt>- 랙돌</dt> <dd>매우 느긋한 성격으로 평소에 매우 느릿느릿한 걸음걸이로 움직인다.</dd> <dt>- 뱅갈</dt> <dd>살쾡이나 표범을 떠올리게 하는 독특하고 매력적인 품종이다.</dd> <dt>- 아메리칸 쇼트헤어</dt> <dd>순종으로 등록된 품종 중 일반 집고양이의 체형과 가장 가깝다.</dd> </dl>
