망막 디스플레이에 대한 특정 스타일 시트 설정

Question

사용자 장치가 망막이 아닌 망막인지 망막인지에 따라 다른 스타일 시트를 설정하는 방법을 찾고있었습니다. 나는 여러 가지 방법으로 여러 가지를 발견 했으므로 이제 어느 것을해야할지 모른다. 내 의견으로는이보다 쉽고 효율적으로 보이지만 하나

<link rel="stylesheet" href="myCss.css" media="screen and min-device-pixel-ratio: 2"> 

하지만, 그것은이 최신 구문 확실하지 않다가, (IE9 포함) 모든 최신 브라우저에 대해이 작품은 방법이됩니다 이 방법을 개선하기 위해? 기존 스타일 시트

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
    /* Retina-specific stuff here */ 
} 

에서

Answer 1

link 태그의 media 속성을 가진 당신의 접근 방식은 좋은 시작이다

CSS-Tricks

에서. .css에서 직접 사용할 수있는 새로운 media query을 사용하는 것이 좋습니다.

http://www.w3.org/TR/css3-mediaqueries/

당신과 그렇게 할 수 있습니다 :

@media only screen and (min--moz-device-pixel-ratio: 2), 
only screen and (-o-min-device-pixel-ratio: 2/1), 
only screen and (-webkit-min-device-pixel-ratio: 2), 
only screen and (min-device-pixel-ratio: 2){ 
    /* The retina stuff here */ 
    } 

학습과 독서 : http://menacingcloud.com/?c=highPixelDensityDisplays

Answer 2