视网膜媒体查询iPhone使用HTML

-1

我想让视网膜在iPhone应用程序（HTML，CSS3和JS）上工作。这是iPhone应用程序。视网膜媒体查询iPhone使用HTML

我试过如下，它不适用于下面的两个.png图像？

HTML：

<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>

CSS3：

.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/[email protected]"); 
    } 
}

来源

2012-12-13 Irishgirl

尝试一些更多选择你的班级列表删除分号。 – BenM

你是说这个班='滑动; MYIMAGE; myImage2; – Irishgirl

是的，删除分号。 – BenM

看起来它只是一个语法问题，缺少 '唯一'。尝试：

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

}

有在http://css-tricks.com/snippets/css/retina-display-media-query/

来源

2012-12-13 00:12:57

这是iphone。它工作吗？ – Irishgirl

@Irishgirl只需在'和（min-width：480px）'这样的东西中添加它就是iPhone。 –

视网膜媒体查询iPhone使用HTML

回答

相关问题