Question

我创建了以下网页：

问题在于我的Lumia，在UC浏览器以及Edge中，文本很小。（实际上，一切都变得很小。我必须放大以便阅读任何内容。）

这是我的CSS代码的问题吗？或者，移动浏览器是否错误地报告了设备的屏幕尺寸？我写了一些媒体查询，根据em单位的屏幕大小呈现略有不同的样式，但是没有检测到最小尺寸。

我想解决这个问题，如果问题出在网页上，但我不知道怎么判断是网页的错误，还是是什么问题是。

请帮忙！

Answer 1

尝试将以下内容添加到<head>：

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

您将面临的下一个问题是您使用表格。这些将导致页面布局更宽，因为它们不会换行。你可以做的是将它们放在一个响应的包装器中，它将滚动任何额外的溢出：

<div class="scroll-overflow">
    <table>...</table>
</div>

div.scroll-overflow {
    overflow-x: scroll;
}

最后，您要在网站底部加载完整的728x90广告。这也会导致整体布局非常宽，因此在屏幕上显示的尺寸要小得多。

您应该在这里放置一个更窄的广告，或者使用CSS限制广告范围。通过这些微小的变化，您的网站会立即变得对移动用户友好多倍。

这是前（左）和后（右）。