移动设备上的高度问题

Question

我正在编写一个移动网站。这是我第一次这样做，所以我不知道我做错了什么。

如果文本适合页面的高度，一切正常，但是当它高于移动设备屏幕的高度时，页面会变得混乱（它在页面右侧添加了填充，我有一些空白在那里)。

我试过了

body { height: auto }

和

body { height:100% }

我确定我做错了什么。请帮忙。 谢谢

Answer 1

我相信您的问题是因为屏幕尺寸已关闭而自动调整，为避免这种情况，您应该在页面顶部插入这段方便的代码

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

它摆脱了某些移动浏览器的自动适配。 Mozilla 有一个示例 here。

还可以查看响应式 CSS 媒体查询，因为它们（在我看来）是处理移动设备的最佳方式。 Brad Frost 是学习响应式设计的好人。

希望有帮助。