처리중입니다. 잠시만 기다려주세요.
TTJ 코딩클래스
정규반 단과 자료실 테크 뉴스 코딩 퀴즈
퀴즈 / CSS / 문제

CSS prefers-reduced-motion 미디어 쿼리의 역할은?

보통 MDN Web Docs
보기 및 정답
A 사용자가 운영체제에서 모션 감소를 설정했는지 감지하여 애니메이션을 조정한다
B 반응형 이미지를 위해 max-width: 100%를 설정하면 이미지가 왜곡된다
C container query는 미디어 쿼리와 동일하게 뷰포트 기준으로 동작한다
D 미디어 쿼리는 JavaScript 없이 화면 크기를 감지할 수 없다

해설

@media (prefers-reduced-motion: reduce)는 사용자가 OS 접근성 설정에서 '움직임 줄이기'를 활성화했는지 감지합니다. 전정 장애나 멀미를 겪는 사용자를 위해 과도한 애니메이션, 자동 재생 등을 줄이거나 대체 효과를 적용하는 접근성 필수 기법입니다.

코딩, 제대로 배우고 싶다면?

개념 확인은 퀴즈로, 실력은 실전 프로젝트로.
투더제이 코딩클래스에서 시작하세요.

정규반 살펴보기