上周做了一個原生H5小游戲頁面，使用rem來布局，然后在三星和華為的部分機型里面出現(xiàn)了rem計算出現(xiàn)誤差的情況，截圖如下

在頁面rem計算完成后，用兩種方式獲取font-size。然后結(jié)果不一樣，導(dǎo)致某些元素通過rem計算后的值，產(chǎn)生了誤差

修復(fù)

通過比較document.documentElement.style.fontSize和window.getComputedStyle(document.documentElement)[“font-size”]的差值，如果誤差大于1，我們就重置html的font-size

var html = document.getElementsByTagName('html')[0];

var settedFs = settingFs = parseInt(html.style.fontSize);

var whileCount = 0;

while(true) {

var realFs = parseInt(window.getComputedStyle(html).fontSize);

var delta = realFs - settedFs;

if (Math.abs(delta) >= 1) //不相等

{

if (delta > 0) settingFs--; else settingFs++;

html.setAttribute('style', 'font-size:'+settingFs + 'px!important');

} else

break;

if (whileCount++ > 100) //之所以弄個100的循環(huán)跳出的原因，在于實在無法預(yù)判設(shè)備是否能計算得到36px，比如設(shè)備只能計算35px，37px，這樣會死循環(huán)只能跳出了

break

}

參考

AD：【快收錄網(wǎng)】免費收錄

總結(jié)

以上是生活随笔為你收集整理的android webview rem,Android部分webview rem计算误差记录的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。