javascript - 移动浏览器的“放大”选项

Question

我有一个遗留的网络应用程序，它是在移动浏览器出现之前很久就编写的，更不用说响应式设计了。因此，一切都是静态的。

我无法修改站点页面的所有方面。例如，我不能更改主容器设置为 900px 和自动边距。但是通过其他服务器端输出类，我可以修改这里那里的位。例如，一个类构建一个 <div>元素与其他嵌套标记，我可以向任何此标记添加内联样式和属性。我还可以在一定程度上修改标题包含。所以我对选项感到疑惑:

• 现在，整个页面都适合移动视口(viewport)，使文本变得很小。我可以改为放大移动设备吗？我不介意您看不到所有内容，但至少字体大小可读。是否有一些 CSS 或元标记可用于默认缩放？ (不过，桌面浏览器必须保持原样)

• 如果我在一个页面中有一个 iframe，比如说 320 像素宽，有没有一种方法可以让我在页面加载时自动聚焦该 iframe，以便它填满我的移动视口(viewport)的宽度？

• 纯 JavaScript 是一个选项(没有像 jQuery 这样的外部库)；如果这不能通过标签或样式来完成，是否有我可以使用的 JavaScript 方法？

对于缺少示例代码，我深表歉意...我当然尝试过一些不同的 CSS 属性，但无论如何我总是在查看缩小的整页版本。

Answer 1

为了确保您的字体可读，您可以使用每个百分比的字体大小而不是像素(如果您使用的是像素)。

如果有帮助，请查看这篇关于移动自适应设计的文章:

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries