[입문] 웹 프론트 엔드 - 4주차 - position layout

position layout

css position layout 입니다.

주로 모달 팝업을 띄울때 많이 사용하게 되는 녀석입니다.

float와 달리 부모를 기준으로 띄우는 개념이라 스티커처럼 생각하시면 쉽습니다.

사용하는 값은 아래와 같습니다.

.class{position:relative | absolute | fixed | static}

static 선언을 제외한 속성에서 top, bottom, left, right 속성을 사용할 수 있습니다.

• relative
  부모가 되는 속성이며 자기 자신을 기준으로 위치를 잡습니다.
  
  
• absolute
  자식이 되는 속성이며 부모로 relative, absolute, fixed 를 삼습니다.
  부모를 기준으로 위치를 잡습니다.
  
  
• fixed
  브라우저 창을 기준으로 위치를 잡습니다.
  
  
• static
  position 속성을 더이상 사용하지 않습니다.