【已解决】移动端 ios safari 聚焦后页面自动放大,出现滚动条

968 阅读1分钟

【已解决】移动端 ios safari 聚焦后页面自动放大,出现滚动条

出现放大原因:

移动端ios为了用户输入和查看input or textarea 体验,会在聚焦时候字体放大,读看编辑更方便。

解决办法:

设置输入框聚焦时字体大小为16 则不会自动放大。因为ios自动放大是为了让字体放大用户看的字更清楚

示例: 给input 、textarea focus时设置font-size: 14px

    input {
      font-size: 14px; // 原来的字体可以自定义大小
    }
    input:foucs {
        font-size: 16px; // 必须写16px, 其他不生效
    }

为什么不建议用meta 阻止用户缩放

用户缩放能力本该是用户该享有的权利和体验。