position

• 요소의 위치를 정의
• 요소를 움직여서 배치함
• body {margin : 0;} -> 기본 브라우저의 css값 초기화

1. positin : static;
   • 기본값
   • 좌표 프로퍼티 사용 불가
2. position : relative;
   • 상대적 위치
   • 기본 위치(원래 static일 때 있어야 할 위치)를 기준으로 좌표 사용
   • width, hegiht값이 없을 때 원래<div>처럼 block요소로 작용
3. position : absolute;
   • 절대 위치
   • 부모나 조상 중 relative, absolute, fixed가 선언된 곳을 기준으로 좌표 프로퍼티 적용
     - 만약 부모나 조상 프로퍼티에 relative, absolute, fixed가 없다면 최상단인 body태그를 기준으로 위치가 지정됨
   • width, height값이 없을 때 원래div처럼 block요소로 작용하지 않고 inline요소로 작용
     -width와 height 값을 주면 정상적으로 적용됨
     -다만 값이 없을 땐 너비(width)만 inline처럼 딱 붙게 되는 것 = inline-block과 동일!
     
4. position : fixed;
   • 보이는 화면을 기준으로 좌표 프로퍼티를 이용하여 위치를 고정
   • 스크롤할 때마다 따라다니는 메뉴가 이를 활용한 것

z-index

• 숫자 값이 클수록 전면에 출현함
• static을 제외한 요소에서 사용

flexbox

• 크기가 불분명한 요소들에 대해서도 효율적으로 동작함
• 특별한 계산없이 쉽게 정렬 가능
• 핵심 : 가로 혹은 세로의 정해진 방향을 기준으로 프로퍼티를 정렬