​​ #16 목록(리스트)을 나타내는 태그들 배우기

#16 목록(리스트)을 나타내는 태그들 배우기

목록태그에 대해 알아보겠습니다.
목록을 나타내는 태그에는 dl, dt, dd와 같이 각 목록앞에 숫자나 부호가 아무것도 붙지 않는 정의 리스트용 태그와 ul, li와 같이 목록 앞에 3가지 모양의 부호(type=disc / cicle / square) 중에서 한가지를 나타나는 무번호 리스트용 태그, 그리고 ol와 같이 5가지 종류의 목록(type=1/A/a/I/i)중 하나를 순서대로 나타나게 하는 순서 리스트용 태그가 있습니다.

 

 

 

1. 정의 리스트 태그

- <dl> : 목록의 시작과 끝을 지정하는데 사용됩니다.
- <dt> : 정의하고자 하는 항목(제목)을 나타내는데 사용됩니다.
- <dd> : 내용을 적을 곳에 사용합니다.


예제))
<dl> <dt> 총기시대 공략 </dt> <dd> it-fix 블로그를 이용해주세요 </dd> </dl>

 

출력))

총기시대 공략

it-fix 블로그를 이용해주세요

2. 무번호 리스트 태그

- <ul> : 목록 앞에 3가지 모양의 부호(type=disc / cicle / square) 중에서 한가지를 나타납니다.

- <li> : <ul>태그로 지정한 목록의 각 세부항목을 표시합니다.

 

예제))

<ul type="disc"> <li>총기시대 공략<li>it-fix블로그에서</ul>

 

출력))

    • 총기시대 공략
    • it-fix블로그에서

 

3. 순서 리스트 태그

- <ol> : 5가지 종류의 타입목록(1/A/a/I/i) 중에서 한가지를 순서대로 출력되게 해주는 태그입니다.

- <li> : <ul> 또는 <ol> 태그로 지정한 목록중의 세부목록을 나눠주는 태그입니다.

 

예제))

<ol type="A"> <li> 총기시대의 공략 및 팁 <li> it-fix 블로그에서 <ol>

 

출력))

      1. 총기시대의 공략 및 팁
      2. it-fix 블로그에서 

이상에서 간단히 목록의 리스트를 데이터 입력시 자동으로 나타나게 해주는 태그들의 사용법을 살펴보았습니다.

위의 태그들의 최대의 장점은 데이터 입력중에 한개의 목록을 입력한 후 엔터를 누를 경우 자동으로 다음 순서의 리스트 순서태그를 입력해준다는 점일 것입니다.

댓글

Designed by JB FACTORY