Question

我正在测试一部带有2部iPhone的移动网站。当我将1旋转到横向模式时，文本会调整大小（所需）。当我将另一个旋转到横向模式时，文本不会调整大小（不需要）

我尝试使用-webkit-text-size-adjust样式，但会出现相同的行为

html, body, p, div, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust:none;
}

我的头标记

<head>

    <meta charset="utf-8">

    <title>Site</title>

    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320"/>
    <meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum-scale=1.0">

    <link rel="stylesheet" href="style.css">

</head>

是否有一些设置可以更改为始终调整文本大小？我应该重新访问移动设备的元信息吗？

修改：

iPhone1 = iPhone 4 Verizon running iOS 4.2.6
iPhone2 = iPhone 4 AT&T running iOS 4.3.5

由于

Answer 1

设备宽度始终指纵向模式下的宽度，因此width = device-width将在横向模式下缩放视口。这是iPhone的一个怪癖（我也认为是iPad）。看起来有点愚蠢，但这就是苹果公司做到的。

所以只需使用：

<meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0">

或者更好的是，这仍然允许用户根据需要进行扩展：

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

iPhone文本在纵向和横向之间调整大小

1 个答案: