一开始所有移动设备都会放大50%。这是除iPad以外的所有设备。试着用PHP检查将iPad以外的屏幕缩放50%但是当你从横向->纵向->横向移动时它会再次缩放50%
这是我当前的meta标签:
<meta name="HandheldFriendly" content="true" />
<meta name="viewport" content="width=640, height=700, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
我的HTML没有使用任何宽度100%只有在px。总的来说，内容不会扩展到640宽700高。
有谁知道我怎样才能避免这个问题吗?
编辑
得出结论，@hakre关于像素的比例是正确的。我的解决办法是设置每个宽度%而不是px。这样无论如何它都会自动调整大小。有一件事要注意的是，我移除了刻度。原因是它似乎在一些设备上弄乱了布局。再次感谢@hakre
我只在Android的默认浏览器和Opera Mobile上测试过，但看起来效果不错。不幸的是，仍然没有办法在Android浏览器上禁用缩放…
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="viewport" content="target-densitydpi=device-dpi" />
<meta name="HandheldFriendly" content="true"/>
在CSS中，px是一个绝对长度单位。当输出环境已知时，它们主要是有用的。
对于CSS设备，这些尺寸要么锚定(i)通过将物理单位[in, cm, mm, pt, pc]与它们的物理测量相关联，要么(ii)通过将像素单位[px]与参考像素相关。[由我添加和高亮]
如果参考像素是设备显示的物理像素的一半，则CSS值为700px将在显示上转换为350px -或您问题中所说的50%。
所以你在这里的体验是完全正确的，CSS在你选择px单位的意义上是正确的，你只是错过了CSS中的px与显示器上的像素不同。如果不是，但你希望它是，看起来你选错了单位。
再次说明:绝对长度单位主要用于已知输出环境的情况。
也许你找到一种方法来告诉浏览器修改参考像素?这会解决你的问题。或者现在你知道会发生什么，检测设备并相应地改变长度。
作为一种替代方法，您可以用相对长度(em, ex)替换绝对长度。因为它们是相对的，你只需要改变相对元素的长度，就可以改变整个页面。
这通常是通过在<html>和/或<body>元素上使用绝对长度，而在其他元素上使用相对长度来完成的。
这个方法也可以帮助你解决这个问题