HTML을 사용하여 iphone에 대한 Retina 미디어 쿼리

Question

망막이 iPhone 앱 (HTML, CSS3 및 JS)에서 작동하도록하려고합니다. 아이폰 앱입니다.

아래와 같이 시도했지만 아래의 두 .png 이미지에서는 작동하지 않습니까?

HTML :

CSS3

<div id='slider13' class='swipe; myImage; myImage2;'> 
<ul> 
<li style='display:block'><div><img style="vertical-align: bottom" src="**images/10a.png**" border="0" ></div></li> 
<li style='display:block'><div><img style="vertical-align: bottom" src="images/10b.svg" border="0" ></div></li> 
<li style='display:block'><div><img style="vertical-align: bottom" src="**images/10c.png**" border="0" ></div></li> 
<li style='display:block'><div><img style="vertical-align: bottom" src="images/7b.svg" border="0" ></div></li> 
<!-- <li style='display:none'><div><img style="vertical-align: bottom" alt="" title="" border="0" class="shadow" /></div></li> --> 
</ul> 

: 그것은 '만'실종 그냥 문법 문제처럼

.myImage { 
height: 100%; 
width: auto; 
-webkit-background-size: 100% auto.; 
background: url("../images/10a.png"); 
} 
@media screen and (-webkit-min-device-pixel-ratio: 2), 
screen and (max-moz-device-pixel-ratio: 2), 
and screen (max-device-width: 320px) { 
.myImage { 
    background: url("../images/10a@2x.png"); 
    } 
} 

Answer 1

보인다. 시도 :

@media only screen and (-webkit-min-device-pixel-ratio: 2), 
     only screen and ( min--moz-device-pixel-ratio: 1.5) { 

} 

당신의 classlist에 세미콜론을 제거 http://css-tricks.com/snippets/css/retina-display-media-query/