CSS의 5가지 position 속성 값 기본 정리

CSS에서 position 속성은 HTML 문서 상에서 요소(element)가 배치되는 방식을 결정합니다. 요소의 정확한 위치 지정을 위해서 `top`, `left`, `bottom`, `right` 속성과 함께 사용되기도 하지요. 이번 시간에는 CSS에서 position 속성 값으로 사용할 수 있는 `static`, `relative`, `absolute`, `fixed`, `sticky`에 대해서 함께 간단한 실습을 하면서 하나씩 정리해보겠습니다. 📺 동영상: https://youtu.be/PEyp9TBcZ-o 📝 포스팅: https://www.daleseo.com/css-position/ 🧑‍💻 실습 코드: * position-static: https://codepen.io/daleseo/pen/mdMdzob * position-relative: https://codepen.io/daleseo/pen/qBXBJzg * position-absolute: https://codepen.io/daleseo/pen/abybRra * position-fixed: https://codepen.io/daleseo/pen/rNzNqXv * position-sticky: https://codepen.io/daleseo/pen/LYjYgrg CSS의 position 속성에 대해서 좀 더 공부하고 싶으시다면 아래 게시물도 참고해보세요 :) 📕 CSS의 fixed position을 통한 HTML 요소의 위치 고정: https://careerly.co.kr/comments/92417 📗 CSS의 fixed position으로 메뉴바 상단 고정하기 🔝: https://careerly.co.kr/comments/86578 📘 CSS의 absolute position 작동 메커니즘 이해: https://careerly.co.kr/comments/92417