那么,如何在移动浏览器上显示完整尺寸的网页,以便“300px”实际上在移动设备的屏幕上以300个真实像素表示?
我知道Meta视口方法,但是从目前为止我所知道的,当缩放设置为100%并且宽度设置为device_wIDth时,在这种情况下使用的像素比为1.5或1.0,并且您可以检测移动设备正在渲染的像素比率.我似乎无法找到某种方法明确强制设备仅使用1.0像素比率而不使用1.5像素比率.
如何让设备使用1.0的像素比率,以便CSS中定义的300“像素”实际渲染移动设备屏幕上的300像素?如何以实际尺寸显示网页,而不是像素比率为1.5?
编辑2011年10月24日下午6:50:这是我不想要的一个例子:
目前,如果您使用元标记来设置移动浏览器的视口属性,如下所示:
<Meta name="vIEwport" content="wIDth=device_display,initial-scale=1.0" />
然后这意味着移动浏览器将呈现页面几乎与页面设计完全一样,除了CSS中定义的每个“像素”实际上包含设备屏幕上的1.5像素,因此像素比率为1.5.设置这种1.5像素比率的惯例,使得设计在高分辨率设备上看起来不会太小.
我理解这一点,但在我的情况下,我不希望这样.
我希望强制像素比率为1.0,我会以自己的方式处理高分辨率设备.如何在移动浏览器中强制使用1.0像素比率?
Here’s the info解释了视口元标记和像素比例问题.
此外,here’s a trick允许您根据检测到的像素比率显示不同的图形,这不是我想要做的,但如果没有其他选项将会显示.
如何将像素比率强制为1.0?
编辑11/3/2011 8:56 pm:任何人?
解决方法 我不确定你会如何使用它,但我知道在Webkit中实现的媒体查询as -webkit-device-pixel-ratio可以告诉你使用的是什么比例. Gecko实现的最小和最大前缀命名为min – moz-device-pixel-ratio和max – moz-device-pixel-ratio;但是与Webkit实现的相同前缀被命名为-webkit-min-device-pixel-ratio和-webkit-max-device-pixel-ratio取自: https://developer.mozilla.org/en/CSS/Media_queries/.
也请考虑以下链接: http://www.hanselman.com/blog/SupportingHighdpiPixeldenseRetinaDisplaysLikeIPhonesOrTheIPad3WithCSSOrIMG.aspx.我希望它有所帮助. 总结
以上是内存溢出为你收集整理的如何强制网页始终在iPhone和机器人上以1.0(而不是1.5)的像素比率进行渲染?全部内容,希望文章能够帮你解决如何强制网页始终在iPhone和机器人上以1.0(而不是1.5)的像素比率进行渲染?所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)