Php 响应性设计-Android不可扩展

我正在进行的响应性设计提出了另一个问题。为了简单起见，如果屏幕大小或设备大小小于750px，我将主体设置为480px。然后，理想情况下，任何设备上的屏幕都应该缩放以适应宽度

在今天的一些帮助之后，我添加了viewport meta，因此现在CSS对我的iPhone和Android以及最小化时的桌面浏览器都有响应

iPhone看起来很棒；它可以缩放到宽度，因此即使网页的大小约为480px，它也完全适合我的320px iPhone屏幕

然而，在Android上，它放大得太远了。右侧大约有25%-30%的区域不在屏幕上，我必须滚动查看。如果我稍微缩小一点，那么窗口就适合屏幕宽度，看起来很好。我不知道为什么我必须手动缩小

• 为什么Android在加载页面时没有缩小到页面的宽度

我的元标记如下所示：

<meta name="viewport" content="width=device-width,initial-scale=1.0">

@media all and (max-device-width: 750px), all and (max-width: 750px) {
  body {max-width:480px;}
  #container {
    width: 90%;
    margin: 0px auto;
    padding: 0px;
    min-width:480px;
  }
  #rightnav {display:none;}
}

---

如果你打算在320px的屏幕上显示480px的布局，显然你必须缩放，所以这完全符合规定，但iphone“聪明地”忽略了一些全屏显示的规则。

---

您可以将

初始缩放

值设置为0.75，以强制每个设备在开始时保持该缩放级别。当然，更好的解决方案是使用另一个媒体查询，在320px设备上进一步缩小屏幕内容。

您应该采取移动优先的方法。将您的站点设置为320像素宽，然后将设计更改为750像素。这将确保您的站点在小于750px的任何屏幕上都能完美运行。我们正在转换现有的旧站点。不幸的是，用手机页面重新开始并不实用。此外，该网站的宽度超过320像素（有160个和300个pixle广告区相邻）。页面主体有2个横幅广告必须保留。一个是160宽，一个是300宽。加在一起，这是460像素的宽度，我必须有…加上一点填充等等，这就是我要处理的480像素。因此，我需要在iphone上将480px扩展到320，并在各种andriod设备上实现它所需的任何功能。