2024-06-13

Writerside/topics/Positioning.md

@@ -1,3 +1,11 @@
 # 위치 잡기
 
-Start typing here...
+* `position` :
+  * static : 요소를 일반적인 문서 흐름에 따라 배치합니다. `top`, `right`, `bottom`, `left`, `z-index` 속성이 아무런 영향도 주지 않습니다.
+  * relative : 요소를 일반적인 문서 흐름에 따라 배치하고, 자기 자신을 기준으로 `top`, `right`, `bottom`, `left`의 값에 따라 오프셋을 적용합니다. 오프셋은 다른 요소에는 영향을 주지 않으므로, 페이지 레이아웃에서 요소가 차지하는 공간은 static일 때와 같습니다.
+  * absolute : 요소를 일반적인 문서 흐름에서 제거하고, 페이지 레이아웃에 공간도 배정하지 않습니다. 대신 가장 가까운 위치 지정 조상 요소에 대해 상대적으로 `top`, `right`, `bottom`, `left`의 값에 따라 배치합니다.
+  * fixed : 요소를 일반적인 문서 흐름에서 제거하고, 페이지 레이아웃에 공간도 배정하지 않습니다. 대신 뷰포트의 초기 컨테이닝 블록을 기준으로 삼아 배치합니다.
+  * sticky : 요소를 일반적인 문서 흐름에 따라 배치하고, 가장 가까운 블록 레벨 조상을 기준으로 `top`, `right`, `bottom`, `left`의 값에 따라 오프셋을 적용합니다.
+
+* `top`, `right`, `bottom`, `left`
+* `z-index`