[CSS] Position & Display

position : static || fixed || relative || absolute 

static

- default 값

 

fixed

- 고정(스크롤을 내려도 따라내려옴)

relative

- 상대배치

- 부모 element에 적용

- 자식 element에 absolute를 설정해주면 부모 element안에 자식 element이 위치하게 됨

 

absolute 

- 절대배치

- 자식 element에 적용

- 포지션 relative에 상대적으로 포지션을 잡는 것

- 부모 element 에 relative가 설정되어 있지 않으면 absolute로 설정된 element는 body에 맞춰 포지션됨

 

display : inline || block || inline-block || none

inline

- 다른 css 요소 효력 없음

- text 같은 효과..?

- 앞뒤로 줄바꿈 되지 않음

block

- 그 라인에 하나의 element 요소만 있는 것 

inline-block

- 그 라인에 여러 element 존재 가능

none

- 박스가 생성되지 않음