CSS - 문제 미리보기

문제 1482

medium
다음 코드의 동작을 올바르게 설명한 것은? ```css @media screen and (min-width: 480px) { #leftsidebar { width: 200px; float: left; } #main { margin-left: 216px; } } ```
A. 화면 너비가 480px 미만일 때만 사이드바가 왼쪽에 배치됩니다
B. 화면 너비가 480px 이상일 때 사이드바가 왼쪽에 배치되고 메인 콘텐츠에 여백이 생깁니다
C. 모든 화면 크기에서 사이드바가 200px 너비로 고정됩니다
D. 인쇄할 때만 이 스타일이 적용됩니다

정답: B

• 조건부 스타일 적용: `min-width: 480px` 조건으로 화면 너비가 480px 이상일 때만 이 스타일이 활성화됩니다. • 레이아웃 구조: • `#leftsidebar`: 200px 너비로 왼쪽에 float 배치 • `#main`: 216px의 왼쪽 마진 (사이드바 200px + 여백 16px) • 반응형 동작: • 480px 이상: 사이드바가 왼쪽, 메인 콘텐츠가 오른쪽 • 480px 미만: 이 스타일이 적용되지 않아 다른 레이아웃 적용

💡 학습 팁

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