🌿  리팩토링

리팩토링이란, 기능은 똑같지만, 더 가독성 있고, 효율적이고 좋은 코드로 다시 만드는 방법입니다.

relative와 absolute

앞서 학습한 것 처럼, position:relative는 요소를 문서 흐름에 따라 원래 위치에서 상대적으로 이동시키는 방법입니다. 만약 자식이 absolute 로 설정된 경우, 가장 가까운 relative 부모 요소를 기준으로 위치가 결정되게 됩니다.

position: absolute는 문서 흐름에서 제거됩니다. 때문에 다른 요소는 이 요소의 존재를 인식하지 못합니다. 그래서 다른 요소와 겹칠 수도 있어요.

따라서 사진을 겹쳐서 표시하고 싶을때, 위 속성을 잘 활용하면 되겠죠?

📝 실습 코드