iPhone上的CSS媒体查询

问题描述

| 我正在尝试使用CSS媒体查询，尤其是针对iPhone。 当我使用常规链接rel时，它可以工作：

<link rel=\"stylesheet\" type=\"text/css\" href=\"css/mobile.css\" />

但是，当我尝试此媒体查询时，它不起作用：

<link rel=\"stylesheet\" type=\"text/css\" href=\"css/mobile.css\" 
      media=\"only screen and (max-width: 640px)\" /> 

如何使用CSS媒体查询来定位iPhone？     

解决方法

        尝试：

<link rel=\"stylesheet\" type=\"text/css\" href=\"css/mobile.css\" media=\"only screen and (max-device-width: 480px)\" />

区别是

max-device-width

，而不是just4ѭ。另请参阅http://blogs.sitepoint.com/iphone-development-12-tips/上的2）。     ,        我知道这并不是您所要求的，但我刚刚回答了类似的问题，可能会有所帮助：

<meta name=\'viewport\' content=\'width=device-width; initial-scale=1.0;\' />

CONTENT有很多参数，其中一些是：

maximum-scale=3.0; //Maximum zoom allowed 0 to 10.0. default is 1.6
minimum-scale=0.5; //Minimum zoom allowed 0 to 10.0. default is 0.25
user-scalable=1; //YES/NO
width=device-width; //default if not set is 980px 
initial-scale=1.0; //Initial zoom. 0 to 10.0. 1.0 would be 100%
height=device-height;  

iOS 3.1.3上的UIWebView中的内容显示为已放大，但iOS 4.3上的内容显示为正常 编辑：您也可以在Safari中使用这些参数，而无需为原始应用程序使用uiwebview。