나는 엔지니어/HTML

DIV / SPAN : 페이지를 논리적인 구간으로 나누기 & float / 포지셔닝에 관해서

호야선생 2012. 7. 1. 17:25

DIV의 영역은 한줄 전체인 반면에 SPAN의 영역은  태그안의 내용 만큼만이다


span은 특정한 단어들의 스타일을 변경할때 사용한다.

하지만 단지 단어의 강조만을 나타낼 경우에는 em 혹은 strong 태그를 사용한다.



float  컨텐츠 띄우기 ( 명시적으로 width 사이즈를 설정해야 한다.)

float : left;  왼쪽으로 띄우기

float : right;  오른쪽으로 띄우기 


clear float 지우기 ( 상위에 float이 설정되어 있다면 자동으로 아래 모든 컨텐츠에도 반영된다. ) 

clear : left;  왼쪽으로 띄우기 중지

clear : rgiht; 오른쪽으로 띄우기 중지


position 속성


static (default )

다음칸(줄)에 순서대로 배치 

absolute

문서의 기본flow를 벗어난다
부모 요소를 기준으로 top,bottom,left,right 값에 따라 div가 위치한다. 

relative

기본flow를 기준으로   top,bottom,left,right 값에 따라 상대적으로 위치한다.