position 배치

정적배치 position: static (디폴트)  왼쪽- >오른쪽 위쪽-> 아래쪽

 

상대배치 position: relative 현재위치로 상대위치를 top bottom left right 움직임

 

절대배치 position: absolute 영역 내에서의 절대 위치를 top bottom left right로 배치 

브라우저 크기가 변해도 절대 배치된 태그위치는 변하지 않는다. 

 

고정배치 position: fixed 브라우저 기준 지정한 위치에 고정 

예 ) 브라우저를 확대해도 오른쪽 아래에 위치해 있음 

 

유동배치 float: left  / right 

 

 

전체 배경안에 다 들어오지않는다. 

이럴떄 전체박스 태그안에 overflow: hidden 을 써주면 된다. 

이유는 모르겠다.