如何使网页在桌面和移动设备上可读而不用拧字体大小？

Question

我希望能够以一种可用于桌面和移动设备的方式格式化我的博客，而无需尝试检测移动浏览器。作为 web 标准的粉丝，我认为如果我只使用基本的 HTML 而不使用任何样式，它应该是可用的，但事实证明 iPhone 和 Android 浏览器都以微小的文本呈现（显然是为了复制布局在桌面浏览器上看到）。

我知道我可以使用媒体查询和其他十几种技术在移动浏览器上获得我想要的外观。我很想知道是否有任何方法可以让移动浏览器以设备默认字体大小显示某些内容，而无需求助于 font-size: 20pt;在样式表中。有没有什么“是的，这只是普通的 HTML，所以不要试图假装你有桌面浏览器的宽度”吗？

Answer 1

viewportmeta 为移动设备创造了奇迹。这将使视口成为设备的大小，而不是试图将其放大并缩小：

<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

您可能会看到其他版本的 width=device-width 等。这会起作用，但是当它处于横向模式时它也会扩大您的网页（我认为这是不受欢迎的）。使用所有这些比例约束将确保视口的大小适合两个方向。

创建viewport meta 的Apple 拥有documentation on it。