iOS WKWebview字体自动放大的问题

问题描述:
wkwebview加载内容时,默认自动适配屏幕宽度,也可以根据后台设置的内容宽度调节显示方式,方法如下,参数contentWidth即后台设置的显示内容宽度:

public func loadHTMLString(_ htmlString:String, _ baseUrl: URL, _ contentWidth: String) {
        var widthStr = "device-width"
        if CGFloat(contentWidth) != nil {
            widthStr = contentWidth
        }
        // 调整文字适应移动端显示
        let html = htmlString + "\n" + " "
        webView.loadHTMLString(html, baseURL: baseUrl)
    }

但是这样会出现一个问题,当宽度设置较大时字体会默认放大,即使修改viewport 的initial-scale、minimum-scale、maximum-scale、user-scalable也不生效。
解决方案:
iOS上需要调整 webview 的字体大小时,是通过给 body 设置 -webkit-text-size-adjust 属性解决的,可通过以下代码实现,这样内容宽度变大时字体也不会随之变大:

public func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        webView.evaluateJavaScript("document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '100%'", completionHandler: nil)
    }

更详细的解析参考:
移动端字体放大问题的研究
-webkit-text-size-adjust使用汇总

你可能感兴趣的:(iOS WKWebview字体自动放大的问题)