일반적인 태블릿 크기에 대한 CSS 미디어 쿼리

다른 태블릿을 사용하여 테스트하려는 사람이 있거나 태블릿 크기 (http://nmsdvid.com/snippets/)를 타겟팅하는 내 쿼리가 작동 하는지를 이론적으로 이해할 수 있으면 좋겠다고 생각했습니다.일반적인 태블릿 크기에 대한 CSS 미디어 쿼리

내 주요 질문은 연산자 (특히 4 개의 다른 장치 중 하나를 타겟팅하는 경우)가 올바른지 여부입니다.

@media only screen and (
    ((min-device-width : 768px) and (max-device-width : 1024px)), 
    ((min-device-width : 600px) and (max-device-width : 1024px)), 
    ((min-device-width : 800px) and (max-device-width : 1080px)), 
    ((min-device-width : 800px) and (max-device-width : 1280px)) 
) and (orientation : landscape) { 

    body{ background-color: pink; } 

}

출처

2012-09-06 simey.me

다음을 확인하십시오 : http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ –

고마워요, 그건 저의 출발점이었습니다. 그러나 지금은 많은 타블렛이 있습니다. 그들 중 iPads와 같은 장치 너비가 없다 ... 그래서 내 구문이 더 강력한 타블렛 - targetter로 작동하는지 알고 싶었어요 :). –

내가 아는 가장 좋은 방법은 장치 불가지론 응답 레이아웃 방법을 사용하는 것입니다.

범위에 대한 미디어 검색어 (예 : 타겟팅하는 모든 태블릿을 포괄하는 크기)를 설정 한 다음 유체 접근 방식을 사용하여 UI를 기기의 크기에 맞게 확장하거나 축소합니다.

http://coding.smashingmagazine.com/2012/03/22/device-agnostic-approach-to-responsive-web-design/

시장의 일상에 오는 많은 장치가있다, 그것지는 전투는 각각의 모든 사람을 대상으로 특별히 시도하고있다.

출처

2012-09-06 12:54:54 Lowkase

불행히도 귀하의 질문에 대한 답변이 없습니다. '일반적인 태블릿 크기'라는 질문에 대한 답변이 없기 때문입니다. 넷북과 같은 더 넓은 해상도의 현재 태블릿 및 태블릿보다 좁은 오래된 랩톱을 찾을 수 있습니다.

my database of media features을보고 최선을 다하십시오.

즉, Lokase 대답은 최고입니다. 장치를 타겟팅하지 말고 모든 해상도에서 웹 사이트를 멋지게 만드십시오.이 복잡하지 않은 이 아닙니다.

출처

2012-11-04 23:25:59 pieroxy

일반적인 태블릿 크기에 대한 CSS 미디어 쿼리

답변

관련 문제