기본 스타일
작은 화면을 기준으로 읽기 쉬운 단일 흐름을 만든다.
Responsive CSS
브레이크포인트 레이아웃 전환
미디어 쿼리는 화면 폭 조건에 따라 같은 컴포넌트의 배치, 간격, 표시 밀도를 바꾸는 규칙이다.
폭에 따라 바뀌는 UI 판단
breakpoints조건 추가
min-width 구간에서 열 수와 여백을 점진적으로 늘린다.
컴포넌트 영향
카드, 버튼, 이미지 비율이 함께 깨지지 않는지 본다.
경계 검수
정확한 기준 폭 앞뒤에서 줄바꿈과 겹침을 확인한다.
base mobilemedia querytabletdesktopedge check
브레이크포인트는 기기명이 아니라 레이아웃이 답답해지는 지점이다. 콘텐츠가 기준을 정하게 해야 한다.