对于我当前的移动网络项目，我使用meta“viewport”标记来指示移动浏览器使用1：1的比例以及设备的宽度：
<meta name="viewport" content="initial-scale=1.0, width=device-width, height=device-height, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
这适用于IE移动版，iPhone Safari甚至Opera 10测试版，但它不适用于Opera 9.7，默认安装在HTC HD2上。 HTC HD2的设备尺寸为480x800，因此视口在纵向模式下的宽度应为480。但显然Opera mobile 9.7（也许也是9.5）设置了一个错误的宽度，所以之后一切都放大了一点。我使用一个简短的javascript片段来检查实际的窗口大小：
$（window）.width（） - ＆gt;返回274
window.innerWidth - ＆gt;返回480
当我硬编码480而不是“设备宽度”时，一切正常。与横向模式相同：
$（window）.width（） - ＆gt;返回457
window.innerWidth - ＆gt;返回800
有没有解决方法呢？
问候
答案 0 :(得分：9)
我有点迟到但是： 视口元标记必须被视为CSS像素，而不是屏幕的物理像素。 它们之间的比例可能与器件的物理像素密度有很大差异：
iPhone3：物理320x480px / CSS 320x480px =＆gt;比率= 1，简单。
iPhone4：物理640x960px / CSS 320x480px =＆gt;比率= 2，这就是苹果公司在iPhone4中将像素尺寸缩小两倍时所想做的事情，以便保持3个优化的网站在4上完全相同。
HTC Desire HD：物理480x800px / CSS 320x533px =＆gt; ratio = 1.5，这可能与您使用HTC HD2时的情况相近。
如果你使用视口的width = device-width值，我的猜测是你的设计中不应该有一个固定的宽度，但更好的是以％为单位使用宽度，请记住在大多数（最近的）移动设备中设备的CSS总宽度大约为320像素（纵向）或500像素（风景），大小为1.0。
答案 1 :(得分：3)
我知道这是一个老问题，但它可能对某人有所帮助。 在本文中，有一节关于Opera Mobile 9.7中视口元标记的支持： http://dev.opera.com/articles/view/opera-mobile-9-7-features-standards/ 不支持用户可扩展，最小规模和最大规模的属性，但宽度，高度和初始规模应该是。如果它运行不正常，您可以尝试使用CSS媒体查询。在同一篇文章中有一个描述和例子。
答案 2 :(得分：2)
看看：http://www.quirksmode.org/mobile/viewports2.html 进入一个痛苦的世界：）
答案 3 :(得分：0)
您是否尝试过HandleFriendly标签？
适用于BB，表示您已为小屏幕设计了代码
答案 4 :(得分：0)
查看PPK的Quirksmode.org移动网站。大量信息，以及兼容性表格！