본문 바로가기
front-end 공부하기/Html + CSS

[Html] 목록 list

by 치즈도넛 2022. 6. 1.
반응형

List

ol -- ordered list

  : 순서가 중요한 목록 (ex 요리법, 실시간 검색어 등등)

 

ul -- unordered list

  : 순서가 중요하지 않은 목록

li -- list item

  : 리스트 아이템

**ol과 ul의 자식은 li만 올 수 있다

 

Description List

 -> 정의(서술) 리스트

dl -- description list

dt -- description term

  : 서술된 용어

dd -- description data

  : 기술 자료

 

<dl>
  <dt>치즈 블로그</dt>
  <dd>코딩을 공부하는 블로그 입니다</dd>
</dl>
<dl>
  <dt>치즈 블로그</dt>
  <dt>cheese-donut tistory</dt>
  <dd>코딩을 공부하는 블로그 입니다</dd>
</dl>
<dl>
  <div>
    <dt>사과</dt>
    <dd>사과에 대한 설명</dd>
  </div>
  
    <div>
    <dt>바나나</dt>
    <dd>바나나에 대한 설명</dd>
  </div>
</dl>

**dl의 자식 요소는 오직 div, dt, dd만 가능하다

반응형

댓글