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

发布于 2024-11-28 17:27:42 字数 859 浏览 2 评论 0原文

我正在用 2 部 iPhone 测试一个移动网站。当我将 1 旋转到横向模式时,文本会调整大小(所需)。当我将另一个旋转到横向模式时,文本不会调整大小(不需要)

我尝试使用 -webkit-text-size-adjust 样式,但发生了相同的行为

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

我的 head 标签

<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

谢谢

I am testing a mobile site with 2 iPhones. When I rotate 1 into landscape mode, the text resizes (desired). When I rotate the other into landscape mode, the text does not resize (not desired)

I have tried using the -webkit-text-size-adjust style, but the same behavior occurs

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

My head tag

<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>

Is there some setting that can be changed to always resize text? Should I revisit my meta info for mobile?

Edit:

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

Thanks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

趁年轻赶紧闹 2024-12-05 17:27:42

device-width 始终指纵向模式下的宽度,因此 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">

device-width always refers to width in portrait mode, so width=device-width will scale the viewport in landscape mode. This is a quirk of the iPhone (and I think iPad too). Seems a bit dumb, but this is how apple have done it.

So just use:

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

Or better this, which will still allow the user to scale if they want to:

<meta name="viewport" content="initial-scale=1.0">
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文