唠叨几句：
在移动端再开发的过程中，很容易使用到webview,它也是用来混合开发的中间桥梁，因此解决webview使用过程中出现的问题是非常有必要的；
问题现象与发现：
现象：
日前，在是使用webview加载html过程中出现了一个这样的问题：
页面显示变形；
url中有设置图片，图片展示不全呈截断式；
发现：
其他所有手机都正常，只有一部手机显示不正常(上级的手机,哎)；
后来发现该手机比同款同型号手机显示字体略大，才发现该手机系统字体大小被重置；
经过半天测试，出现此问题的必要条件有三：
html页面采用了rem单位，并且是采用js动态计算html的font-size
html页面被加在了APP中的webview中
手机被重设了字体大小
解决方案：
一.移动端解决方案
一行代码：
webView.getSettings().setTextZoom(100);
方案一虽然看起来比较简单，但是如果我们项目已经上线了，就需要重新发版App，就需要更新等一系列操作；再者如果html其他移动端也有使用，这....接下来会发生的事情就靠大家慢慢猜想了！
二、前段兼容，
话不多说直接上代码：
var docEl = document.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth || 375;
clientWidth > 750 ? clientWidth = 750 : clientWidth = clientWidth;
if (clientWidth){
const fz = docEl.style.fontSize = 20 * (clientWidth / 375);
docEl.style.fontSize = 20 * (clientWidth / 375) + 'px';
window.remscale = clientWidth / 375;
var realfz = ~~(+window.getComputedStyle(document.getElementsByTagName("html")[0]).fontSize.replace('px','')*10000)/10000
if (fz !== realfz) {
document.getElementsByTagName("html")[0].style.cssText = 'font-size: ' + fz * (fz / realfz) +"px";
}
}
};
if (document.addEventListener){
window.addEventListener(resizeEvt, recalc, false);
document.addEventListener('DOMContentLoaded', recalc, false);
}
这段代码，是跟前端开发一起调试验证OK的
在此，感谢前端同学
嘿嘿，咱是移动端开发者，看到这个代码有些蒙蔽，前端开发者一定看得懂...
以上就是解决方式了，希望对您有所帮助...
android webview 字体 系统字体大小 Android 系统字体大小动态改变 导致webview中显示不兼容的问题解决...
