[CSS] 미디어쿼리(Media Query)란? / 주의사항

미디어쿼리란? pc 뿐만 아니라 모바일과 태블릿에도 대응되는 웹사이트를 만들기 위해 모바일에 대응되는 반응형 또는 적응형 웹사이트를 만들 때 사용되는 CSS 구문 미디어쿼리 media .media { width: 500px; height: 500px; background-color: red; } @media (min-width: 320px) and (max-width: 800px) { .media { width: 300px; height: 300px; background-color: yellow; } } min-width와 max-width로 브라우저 가로폭 설정 브라우저의 가로폭이 최소 320px, 최대 800px이 되었을 경우, 중괄호 안의 css 속성으로 대체하겠다는 의미 미디어쿼리가 정상적으로 출..