반응형 웹을 위한 CSS 단위 가이드: px, em, rem부터 dvh까지
CSS 단위는 웹 페이지의 구성 요소의 크기, 간격, 위치를 정의하는 데 필수적인 요소입니다. 특히 반응형 웹에서는 다양한 화면 크기와 환경에 따라 적절한 단위를 선택하는 것이 사용자 경험을 좌우합니다. 이 글에서는 기본 픽셀 단위부터 상대 단위(em, rem), 뷰포트 단위(vw, vh), 그리고 최신 동적 단위(dvh, svh, lvh 등)까지 CSS의 주요 단위를 체계적으로 정리합니다. 각각의 단위가 어떤 상황에서 적합한지, 실무와 면접에서 어떤 기준으로 설명하고 선택해야 하는지를 모두 다룹니다.CSS 단위란? 종류와 분류 체계CSS 단위는 요소의 길이, 크기, 위치, 여백 등을 표현하기 위한 수단입니다. 주로 다음과 같이 분류됩니다:절대 단위: 실제 물리적인 크기를 기준으로 고정된 값 (예: px..
2025. 5. 5.