CSS 미디어 쿼리 - 장치 폭 - 가로

대 세로 나는 다음과 같은 의문이 :CSS 미디어 쿼리 - 장치 폭 - 가로

1)을 수행하는 미디어 쿼리, 변경 모드에 따라 (세로) 가로 대와 일치하는지 장치 폭?

2) 일반적인 랩톱과 데스크탑이 인물 모드와 일치합니까? 화면 회전이없는 장치의 방향이 임의/미정입니까? 또는 항상 세로로 높이 (높이가 < 인 경우) 및 가로 (너비가 < 인 경우)와 논리적으로 일치합니까?

관련

2013-08-24 workwise

1)잘, 네, 대부분의 경우, 다음 예를 살펴 않습니다 화면이 때 이제 스타일 만 적용됩니다

@media all and (max-device-width: 400px) { 
    // styles here 
}

을 400px 너비 이하. 기기가 인 경우 또는 프리 모드 인 경우 은이 아닙니다.

iOS의 경우에 문제가 있습니다. 기기 폭은 항상 320px (iPhone)이거나 iPad의 경우 768px입니다. 따라서 orientation 미디어 쿼리을 사용해야합니다. 그렇지 않으면 사용자가 방향을 변경했다는 것을 알 수 없습니다.

2) 노트북과 데스크톱은 기본 로 landscape 모드와 일치 (하지만 당신은 브라우저 manually)의 방향 모드를 변경할 수 있습니다. orientation의 사용 사례가 iOS에 있으므로 임의/정의되지 않음 오리엔테이션이 없음을 확인할 수 있습니다. 더 읽기 http://cssmediaqueries.com/

,536,913 여기

좋은 CSS3 미디어 쿼리 도구입니다

출처

2013-08-24 12:21:57

최소 또는 최대 너비를 사용하는 것이 좋습니다. 장치 레이아웃을 사용하면 수십만 개의 장치가 있고 각각 해상도가 약간 다를 수 있으므로 문제가 발생할 수 있습니다.

내가 아는 한, 컴퓨터는 레이아웃 모드를 렌더링하지 않습니다.

@media screen and (max-width: 420px) { 
//styles 
} 

@media screen and (min-width: 420px) { 
//styles 
}

각 너비 요소가 규칙에 규칙을 추가하는 미디어 쿼리 (최소 너비)를 사용할 때 모바일 우선 방법을 사용하는 것이 가장 좋습니다. 이렇게하면 중복 된 규칙과 쓰는 것을 막을 수 있습니다. 또한 구식 브라우저의 경우 우아한 브라우저 폴백 (fallback)을 허용합니다.

출처

2013-08-24 14:51:55 Ray

CSS 미디어 쿼리 - 장치 폭 - 가로

답변

관련 문제