12

我在 html 中使用它：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;">

这在CSS中：

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }\

也试过这个：

html { -webkit-text-size-adjust: none; }

然而由于某种原因，这种情况发生了：

在此处输入图像描述 在此处输入图像描述

更新：我尝试删除所有样式以查看我的任何 CSS 是否导致此问题，结果很奇怪：当我不使用任何字体规则时，字体只会变大（它没有放大，因为缩放被锁定通过 HTMLviewport属性）同样，只有小字体变大，标题保持不变。奇怪@#$%

更新 2：我玩了 html/css 并得出了这个结论 - 唯一没有发生文本放大的情况是文本包含在页面中唯一的元素内 - 例如，如果我的所有身体包含的是 p /span/div 带有文本，它不会被放大。如果我添加另一个带有文本的元素，页面上的所有文本都会在横向模式下放大。
我试着做一些研究，浏览了很多移动网站，结果都是一样的——它们都有这个效果。

4

4 回答 4

2

比真正的解决方案更多的信息

根据我对this page和this page的工作方式的理解，所有文本都将根据-webkit-text-size-adjust: auto（iOS 的默认设置）或您的设置在横向模式下重构-webkit-text-size-adjust: 100%。

我不相信该100%设置正在做你认为它正在做的事情（试图保持文本大小相同）。相反，它只会影响“如何应用文本膨胀算法”（根据此页面）。我无法准确找到这可能意味着什么；100%也就是说，对于通货膨胀算法意味着什么。我的猜测是，根据这个页面的报价......

第一次呈现网页时，iOS 上的 Safari 会获取块的宽度并确定适当的文本比例，以便文本清晰可见。

...由于该过程仅在“第一次呈现网页时”发生，一旦设备从纵向变为横向，膨胀算法将根据屏幕宽度的变化“增长”文本更宽，即使当设置在100%。

也许这是因为100%与纵向与横向的宽度差异有关。例如，这个 iPhone 规格是 960 x 640。这可能100%意味着通货膨胀使用了 960 x 640（比如 960/640 x 100%）的某种直接关系，计算结果为 1.5，然后导致“大胆"的横向文本。如果是这种情况，那么理论上-webkit-text-size-adjust可能需要将其设置为66.67%不受影响（将 1.5 因子恢复为 1）。但我不相信它是如此直截了当。

最终，我认为 Andrey Bukati 的回答-webkit-text-size-adjust: none;是唯一保证文本大小不会发生变化的唯一保证。但它可能有其他的，也许是不受欢迎的影响。

于 2012-05-29T00:00:42.713 回答
1

尝试添加以下...

-webkit-transform: translate3d(0,0,0);

于 2013-01-08T09:49:31.177 回答
1

尝试用

html { -webkit-text-size-adjust: none; }
于 2012-05-27T21:57:10.413 回答
0

嗯，试试

body { -webkit-text-size-adjust: none; }

代替

html { -webkit-text-size-adjust: none; }

在这个线程中找到它，它对线程中的人和我都有效。

于 2013-02-03T07:31:58.363 回答