Safari 允许文本根据移动文本大小进行缩放答案

【问题标题】：Safari allow text to scale based on mobile Text sizeSafari 允许文本根据移动文本大小进行缩放
【发布时间】：2023-03-20 07:03:01
【问题描述】：

我发现 iphone Safari 无法响应设备上的文本大小更改（设置->显示和亮度->文本大小）。尝试在 css 中使用 text-size-adjust 属性。 https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust

在设备上更改文本大小时，Chrome 似乎可以正确缩放文本。是否需要任何其他属性才能使其在 iphone Safari 上运行？

https://jsfiddle.net/pey8b4ct/2

<style>
    body {
        -ms-text-size-adjust: auto;
        -moz-text-size-adjust: auto;
        -webkit-text-size-adjust: auto;
    }
</style>
<div>
  <label>Some text box</label>
  <input type="text">
</div>
<div>
<p>
Some paragraph we need to take into account
</p>
</div>
<div>
    <label>Some text box2</label>
<input type="text">
</div>
enter code here

【问题讨论】：

标签： javascript html css ios mobile-safari

【解决方案1】：

看起来添加样式 font: -apple-system-body; 可以解决问题，现在 safari 也可以根据需要进行缩放。另一件事是字体大小应该以 em 为单位，如果它以 px 为单位，则不会缩放。更多详情如下 https://ind.ie/labs/blog/dynamic-type-support/

【讨论】：