麻烦弄清楚为什么我的网站占用了iPhone的一半屏幕

Question

我还没有在Android设备上测试它，因为我没有，但是当我在iphone上访问我的网站时，它看起来像下面的图片。我无法弄清楚为什么它会像那样加载。该网站完全响应，我在标题中有这个：

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

Answer 1

在您网站的<header>元素内，在此div中：

<div class="header-ads f-right">

有一个728x90的Google广告，虽然它在您的网页上不可见，但仍然存在并且正在扩大您的网页并使其余内容缩小。

删除该Google广告可解决此问题。

Answer 2

通常这是因为页面上有一些元素比主内容列宽。后来的iPhone往往会缩小以容纳这些额外的内容。

检查所有元素宽度并确保没有硬编码值。使用宽度：100％表示全宽响应内容。