[HTML5] 목록 태그 <ul>, <ol>, <dl>
목록 태그 - <ul>, <ol>, <dl>
목록을 나열할 때 사용하는 태그는 <ul>, <ol>, <dl> 가 있습니다.
<ul> 태그는 순서가 중요하지 않을 때 사용하는 태그입니다.
<ol> 태그는 순서가 중요할 때 사용하는 태그입니다.
<ul> 태그와 <ol> 태그의 항목은 <li> 태그를 이용합니다.
<dl> 태그는 제목과 그에 관한 설명을 목록으로 표시할 때 사용하는 태그입니다.
<dl> 태그를 사용할 때 제목은 <dt>, 설명은 <dd> 태그를 사용합니다.
<!DOCTYPE html />
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>언제나 휴일 - 목록</title>
<style>
section h3
{
background-color:Aqua;
color:Red;
}
footer
{
margin:10px;
clear:both;
text-align:center;
}
.style_ul
{
background-color:White;
color:Green;
}
.style_ol
{
background-color:Green;
color:White;
}
article dt
{
font-weight:bold;
}
</style>
</head>
<body>
<section>
<article id="use_ul" class="style_ul">
<h3>ul 태그 사용</h3>
<ul class="style_ul">
<li>하나</li>
<li>둘</li>
<li>셋</li>
</ul>
</article>
<article id="use_ol" class="style_ol">
<h3>ol 태그 사용</h3>
<ol class="style_ol">
<li>하나</li>
<li>둘</li>
<li>셋</li>
</ol>
</article>
<article id="use_dl">
<h3>dl 태그 사용</h3>
<dl class="style_ul">
<dt>수</dt>
<dd>하나</dd>
<dd>둘</dd>
<dd>셋</dd>
</dl>
</article>
</section>
<footer>
<p>Copyright 2015 언제나 휴일 ehclub.co.kr</p>
</footer>
</body>
</html>