![]()
미디어 쿼리 1. 미디어 쿼리 - 화면의 크기나 환경에 따라 웹사이트를 변경하는 기술 2. 기본 문법 - 미디어 쿼리를 작성할 때는 기본적인 순서와 규칙을 따라야 함 → @media [only 또는 not] [미디어 유형] [and 또는 , 콤마] (조건문) {실행문} - @media : 미디어 쿼리 문법의 시작을 알리는 부분 - [only 또는 not] - only 키워드 : 미디어 쿼리를 지원하는 브라우저에서만 미디어 쿼리를 해석하게 해주는 키워드 - not 키워드 : not 다음에 오는 조건을 부정하는 키워드 - 미디어 유형 : 미디어별로 적용할 CSS를 따로 작성함. 미디어 유형은 다음과 같음 기기명 설명 all 모든 장치 print 인쇄 장치 screen 컴퓨터 화면 장치 or 스마트 기기 화면..
![]()
미디어 쿼리 1. 미디어 쿼리 - 웹 페이지가 표시되는 장치에 반응하도록 하여 반응형 웹을 구현할 수 있는데, 이때 사용하는 것이 미디어 쿼리임 - 미디어 쿼리는 두 가지 방법으로 사용 가능 - @media 규칙 - media 속성 2. @media 규칙을 이용해 미디어 쿼리 사용하기 Lorem ipsum dolor sit amet consectetur adipisicing elit. Lorem ipsum dolor sit amet consectetur adipisicing elit........... - max-width: 800px는 화면 너비가 800이 되기 전까지의 설정 (최대 너비) - min-width: 800px는 화면 너비가 800이 될 때부터의 설정 (최소 너비) 3. media 속성을 ..
