추적 • comp-particlesgroup2 • script-ssaoeffect • raspberry_pi • freenas • mysql

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

양쪽 이전 판이전 판
tech:css_media_query [2016/07/12 00:56] – 바깥 편집 127.0.0.1tech:css_media_query [2017/02/08 16:38] (현재) – V_L
줄 86: 줄 86:
 </file> </file>
  
 +
 +
 +<file css>
 +@charset “utf-8”;
 +
 +/* All Device */
 +모든 해상도를 위한 공통 코드를 작성한다. 모든 해상도에서 이 코드가 실행됨.
 +
 +/* Mobile Device */
 +768px 미만 해상도의 모바일 기기를 위한 코드를 작성한다. 모든 해상도에서 이 코드가 실행됨. 미디어 쿼리를 지원하지 않는 모바일 기기를 위해 미디어 쿼리 구문을 사용하지 않는다.
 +
 +/* Tablet & Desktop Device */
 +@media all and (min-width:768px) {
 +사용자 해상도가 768px 이상일 때 이 코드가 실행됨. 테블릿과 데스크톱의 공통 코드를 작성한다.
 +}
 +
 +/* Tablet Device */
 +@media all and (min-width:768px) and (max-width:1024px) {
 +사용자 해상도가 768px 이상이고 1024px 이하일 때 이 코드가 실행됨. 아이패드 또는 비교적 작은 해상도의 랩탑이나 데스크톱에 대응하는 코드를 작성한다.
 +}
 +
 +/* Desktop Device */
 +@media all and (min-width:1025px) {
 +사용자 해상도가 1025px 이상일 때 이 코드가 실행됨. 1025px 이상의 랩탑 또는 데스크톱에 대응하는 코드를 작성한다.
 +}
 +</file>
 +
 +http://naradesign.net/wp/2012/05/30/1823/