CSS – position 관련속성

Position

  • 엘리먼트의 위치를 조정하기 위한 방법을 설정한다.
  • position:relative 속성을 position:absolute 요소의 부모요소에 적용하면, 부모요소는 position:absolute 요소의 기준점이 된다.
position:static; (기본, offset을 가지지 않음)
position:relative; (상대적, 원래 위치를 기준)
position:absolute; (절대적, 부모위치를 기준)
position:fixed; (화면에서 고정, ie6 지원 불가)

top:10px;
left:20px;
bottom:10px;
right:20px;

Z-index

  • 엘리먼트의 입체적인 순서를 정의
  • 수치가 작을수록 아래쪽에 있다는 것을 의미
  • z-index의 수치는 엘리먼트 동일한 위치선상에서 적용된다.
    (두 요소중 한 요소의 z-index가 높아도 상위(부모) 엘리먼트끼리의 수치가 낮으면 아래쪽에 위치하게 된다.)
z-index:3;
z-index:10000;
z-index:400;

출처 : 다룸 [ http://darum.daum.net]