목록 관련 태그

 

 

 

---

 

목록에 관련된 태그들은 무엇이 있을까?

 

 

---

 

 

 

 

ul 태그 (+ li 태그)

 

--

ul 태그는 순서가 없는 비순서형 목록을 생성하는 태그이며,

해당 목록의 내용은 li 태그를 사용한다.

 

기본 형식

<ul>
   <li>목록 내용 1</li>
   <li>목록 내용 2</li>
   <li>목록 내용 n</li>
</ul>

 

예시 코드

<h1>공부 중인 언어</h1>
<ul>
  <li>자바</li>
  <li>자바스크립트</li>
  <li>코틀린</li>
</ul>

--

 

 

 

 

ol 태그 (+ li 태그)

 

--

ol 태그는 순서가 있는 순서형 목록을 생성할 때 사용하며

해당 태그의 목록의 내용은 li 태그를 사용한다.

 

기본 형식

<ol>
   <li>목록 내용 1</li>
   <li>목록 내용 2</li>
   <li>목록 내용 n</li>
</ol>

 

예시 코드

<h1>오늘 할일</h1>
<ol>
    <li>아침 스트레칭</li>
    <li>점심 공부</li>
    <li>저녁 헬스</li>
</ol>

--

 

 

 

 

dl 태그 (+ dt태그, dd 태그)

 

--

dl 태그는 정의형 목록을 만들 때 사용하며

목록의 내용에는 dt 태그와 dd 태그를 사용한다.

• dt 태그  :  용어
• dd 태그  : 용어 설명

정의형 목록은
용어와 용어 설명을 나열한 형태의 목록으로 생각하면 된다.

 

기본 형식

<dl>
   <dt>용어 1</dt>
   <dd>용어 설명 1</dd>
   <dt>용어 2</dt>
   <dd>용어 설명 2</dd>
</dl>

 

예시 코드

<dl>
   <dt>사과</dt>
   <dd>사과는 빨간색이다.</dd>
   <dt>바나나</dt>
   <dd>바나나는 노란색이다.</dd>
</dl>

--