HTML 필수 태그 정리(2)_리스트, 정의, 인용,list,ul,ol,li,description list,div,span,quotations

html 태그 정리 두번째 입니다.

 

오늘은 tag 크게 5개의 태그를 준비했습니다.

 

첫번째. lists 리스트 입니다.

ul은 unordered list로 순서가 상관없을때 쓰고

ol은 order list 로 순서가 필요할때 사용합니다.

 

ul과 ol의 자식요소로 li (list item)이 있습니다.

사용법도 간단합니다.

 

ul 태그를 사용한 경우 오른쪽의 결과를 가집니다.

ol 태그를 사용할 경우 오른쪽의 결과를 가집니다.

 

두번째. description list 정의 리스트 입니다.

이것은 용어를 정리할 때 사용하며, <key-value>로 정보제공할때 사용합니다.

<dl></dl>은 정의리스트를 쓰겠다고 말하는 태그이다. 이 안에

<dt></dt> 정의 내리려는 이름 태그와

<dd></dd> 정의의 밸류값 태그 이다.

다음과 같이 사용한다.

 

세번째. Quotations 인용 태그

인용 태그는 누군가의 말을 인용하였을때 사용할 수 있는 태그이다. 두가지 방법이 있다.

1-

<blookquote cite="">내용</blookquote>와

 이 들어가는게 한쌍이다.

cite안에는 출처나 url이 들어간다.

 

2-

<q></q> 태그는

짧은 인용문이나 별도의 블록을 쓰지 않아도 될 곳에 사용한다.

다음과 같이 사용한다.

 

 

오늘의 마지막 태그는 <div>와 <span>

div와 span은 사실 아무런 의미가 없습니다. CSS 스타일을 적용할때 원활한 작업을 위해 그룹핑하는 태그들입니다.

실전에서 사용하다보면 금방 적응할겁니다.

 

div와 span의 차이점은 div는 박스 형태로 영역이 설정되고 그 안에 정렬이 됩니다.

span은 inline 특징을 가지고 있습니다. 

div는 width,height 크기 지정이 가능하지만, span은 불가능합니다.(가능은 하지만 다른 태그들이 다 무시한다.)

span은 inline 특징을 가진다 명심!