코드가 처음인 사람을 위한 Modern HTML CSS
/
CSS Basics
/
Media Query

Media Query

Media Query 를 사용하면, 특정 스크린 사이즈에만 적용되는 CSS 스타일을 만들 수 있습니다

기본적인 Media Query 사용 법을 알아보고, 자주 사용되는 Media Query 패턴을 배워 봅니다

Concept

40 min follow •

featured-image-of-Media Query
HTML Basics
CSS Basics
Instagram Clone
HTML Basics
CSS Basics
Instagram Clone

Section 1

Basic Usages

Basic Usages

Media Query 를 이용 하면, 특정 스크린 사이즈에서만 스타일을 나타나게 할 수 있습니다



이를 이용하면 웹사이트의 HTML 구조를 완전히 새로 만들지 않더라도, 모바일이나 태블릿 등 다양한 디바이스 사이즈에 있어서 일관된 웹사이트 경험을 제공 하기에 편리 합니다



Media Query 는 Inline Style 로 적용할 수 없기에, Class 와 Selector 문법을 사용 해야만 합니다

Loading Summary...
이 튜토리얼을 계속 읽으시려면, 로그인 or 회원가입 해주세요
© 2025 Harbor School - Proudly built with Lighthouse Design System
© 2025 Harbor School - Proudly built with Lighthouse Design System