(웹) element 디테일하게 배치하기 - position 속성

position

레이아웃을 배치하거나,객체를 위치시킬때 사용하는 css 속성이다.

속성은 상속되지 않는다.

 

각각 속성을 적용시켜봤음.

 

실행화면

position: static;

그냥 원래 순서대로 배치됨.

 

position: relative;

원래 자신이 위치한 곳을 기준으로 옵션이 적용된다.

 

position: absolute;

기준점(상위 element들 중에 static이 아닌 position이 기준점이다)을 기준으로 특별한 위치에 위치.

 

position: fixed;

전체화면을 기준으로 동작한다. (ex. 스크롤해도 따라오는 광고)