목록store (1)

connecting dots

Beginner 10회차 (8/8) | 모달 기능 구현 실습, z-index, 리액트 라우터 탐색 방식, React Hooks (useNavigate, useParams), Link, zustand로 상태관리 실습

모달 CSS .modal { position: fixed --> 화면 전체를 덮어야 할 때(화면을 기준으로) width: 100vw --> 화면의 가로너비 100%, height: 100vh --> 화면의 세로너비 100%}.overlay { position: absolute --> 부모요소인 modal을 기준으로 (position을 갖는 것이 우선순위를 갖는다 !) width: 100% --> 뷰포트 쓰지 않아도 됨. 부모요소에 영향을 어차피 받기 때문에.contens { calc(100vh-40px) --> 전체 뷰포트 height에서 위아래 20px씩 공간 남겨놓겠다 overflow: auto --> 자동으로 넘치면 스크롤} z-index- position이 설정된 element에서만..
Live Class/Beginner 2024. 8. 11. 14:18
이전 Prev 1 Next 다음