CSS - 문제 미리보기

문제 1486

easy
Flexbox를 사용해야 하는 상황과 CSS Grid를 사용해야 하는 상황을 올바르게 구분한 것은?
A. Flexbox: 2차원 레이아웃, Grid: 1차원 레이아웃
B. Flexbox: 1차원 레이아웃(행 또는 열), Grid: 2차원 레이아웃(행과 열)
C. Flexbox: 테이블 데이터용, Grid: 텍스트용
D. Flexbox: 모바일용, Grid: 데스크톱용

정답: B

Flexbox (1차원 레이아웃): • 행 OR 열 중 하나의 방향으로만 요소 배치 • 네비게이션 메뉴, 버튼 그룹, 카드 한 줄 배치 등 • 주축(main axis) 하나를 기준으로 요소들을 정렬 CSS Grid (2차원 레이아웃): • 행 AND 열 동시에 요소 배치 • 복잡한 페이지 레이아웃, 갤러리, 대시보드 등 • 격자 형태로 요소들을 배치 선택 기준: • 한 방향으로만 배치 → Flexbox • 격자 형태로 배치 → Grid • 간단한 정렬 → Flexbox • 복잡한 레이아웃 → Grid 실제 예시: • Flexbox: 헤더의 로고-메뉴-버튼 배치 • Grid: 신문 레이아웃 같은 복합적 구조

💡 학습 팁

이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.