REACT1 (공통 컴포넌트) z-index 관리하기 오버레이 공통 컴포넌트인 Modal, PopOver를 구현하기 위해선 각각의 z-index를 관리할 수 있어야 한다. z-index에 대해 알아보자. z-index란? 위 사진과 같이 각 html 요소들의 z축을 정의하는 속성이다. z축이 높을수록 앞으로 튀어 나온다고 보면 된다. z-index 쌓임 맥락(stacking context) 하지만 무조건 z-index가 크다고 해당 요소의 z축이 높게 잡히는게 아니다. 요소의 posiiton, 부모의 z-index등이 어떻냐에 따라 실제 z축이 잡히게 된다. 포토샵 레이어를 생각하면 된다. 위 사진에서 Cat의 Moustache의 z축이 아무리 높다해도, Dog가 Cat보다 위에 있다면 강아지 사진을 역전할 수 없다. 이렇게 z-index는 그룹화되어 사용.. 2024. 3. 9. 이전 1 다음
