HTML 목록 태그들

 

 

목록을 나타낼때 사용하는 태그들

 

<ol> 태그

• Ordered List의 약자로 순서가 있는 목록을 의미한다.
• 순서(순번)이 있는 목록으로 정렬할때 사용한다.

 

start

• 태그의 시작 순서를 나타낸다 
  ex)  <ol start="4">를 하게되면 시작 숫자가 4부터 시작하게된다.

<ol start="4">
	<li>사과</li>
	<li>배</li>
	<li>딸기</li>
</ol>

reversed 

• 태그의 순서를 역순으로 한다.

 <ol reversed>
   	<li>사과</li>
	<li>배</li>
	<li>딸기</li>
</ol>

type : a / A / i / I / 1 이 있다.

• 'a'는 소문자 알파벳,
• 'A'는 대문자 알파벳,
• 'i'는 소문자 로마 숫자,
• 'I'는 대문자 로마 숫자,
• '1' 는 숫자(기본값)

 

	<h1>순서가 있는 "ol태그"</h1>
		<ol>
			<li>사과</li>
			<li>배</li>
			<li>딸기</li>
		</ol>

		<ol type="i">
 			<li>사과</li>
			<li>배</li>
			<li>딸기</li>
		</ol> 
  
 		<ol type="a">
 			<li>사과</li>
			<li>배</li>
			<li>딸기</li>
		</ol>  

<ul> 태그

• Unordered List의 약자로 순서가 없는 목록을 의미한다.

<h1>순서가 없는 "ul태그"</h1>
<ul>
	<li>사과</li>
	<li>배</li>
	<li>딸기</li>
</ul>

<li> 태그

• List Item의 약자로 <ol>, <ul> 태그 내부에서 사용한다.

 

<dl> 태그

• Definition의 약자로 용어를 설명하는 목록을 의미한다

 

<dt>태그

• <dl> 태그 내부에 들어간다.
• 용어의 이름이 들어간다.

 

<dd>태그

• <dl> 태그 내부에 들어간다.
• <dt>태그로 작성한 용어 이름의 정의가 들어간다.

<dl>
  <dt>사과</dt>
  <dd>빈파(瀕婆)·평과(苹果)라고도 한다. 이과(梨果)에 속하며, 지름 5∼10cm정도의 둥근 모양으로 빛깔은 보통 붉거나 노랗다. 원산지는 발칸반도로 알려져 있다.</dd>
  <dt>배</dt>
  <dd>열매 중 먹을 수 있는 부분이 약 80%인데, 수분이 85∼88%, 열량은 약 50kal이다. 알칼리성 식품으로서 주성분은 탄수화물이고 당분(과당 및 자당) 10∼13%, 사과산·주석산·시트르산 등의 유기산, 비타민 B와 C, 섬유소·지방 등이 들어 있다.

</dd>
</dl>