HTML에서 리스트는 순번리스트, 순번이 없는 리스트, 정의리스트 이렇게 3가지가 있다.
1. 순번리스트(Ordered list)
태그 시작 ,끝 : <ol> </ol>
리스트항목 추가 : <li></li>
2. 순번이 없는 리스트(Unordered list)
태그 시작 ,끝 : <ul> </dl>
리스트 항목 추가 : <li></li>
3. 정의리스트(Definition list) : 용어와 그 의미에 대한 리스트이다.
태그 시작 ,끝: <dl> </dl>
리스트 항목 추가 : <dd></dd>
[list.html 화면]
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtm111/DTD/xhtm111.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title> 리스트 공부</title>
</head>
<body>
<h1> 안녕</h1>
<h2> 순번이 없는 리스트</h2>
<ul>
<li> 첫번째</li>
<ul><li>중첩테스트</li></ul>
<li> 두번째</li>
</ul>
<h2> 순번이 있는 리스트 </h2>
<ol style="list-style-type:upper-alpha">대문자 알파벳 순번.
<li> 첫번째</li><li> 두번째</li>
</ol>
<ol>일반 순번
<li> 첫번째</li><li> 두번째</li>
</ol>
<ol style="list-style-type:lower-roman">소문자 로마자 순번.
<li> 첫번째</li><li> 두번째</li>
</ol>
<h2> 정의리스트 용어,설명으로 나눠짐</h2>
<dl>
<dt> 첫번째 용어</dt>
<dd> 용어 설명</dd>
<dd> 용어 설명 2</dd>
<dt> 두번째용어</dt>
<dt> 세번째 용어</dt>
<dd> 설명있음</dd>
</dl>
</body>
</html>
[list.html 코드]
-----------------------------------------------------------------
list.html에 css 적용
css에서 ul에 a라는 클래스를 만들어서 그 안에 마커를 none(없음)으로 바꿔주었습니다.
(헤더파일에 css 추가시켜주는 코드 추가)