rem适配，chrome上模拟和真机上，这么大差别，内容整体下移了，怎么回事，急救

Question

rem,适配方法

(function (doc,win) {

var docEl = doc.documentElement,
    resizeEvt = 'orientationchange' in win? 'orientationchange' : 'resize',
    recalc = function () {
        var clientWidth = docEl.clientWidth;
        if (!clientWidth ) return;
        docEl.style.fontSize = clientWidth / 7.2+ 'px';
        //console.log(docEl.style.fontSize)
    };
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false)

})(document,window)

Answer 1

这不是很正常吗，真机上会有状态栏、浏览器地址栏和工具栏，chrome上没有这些

Answer 2

一切以真机为主

Answer 3

安卓确实会出现字体不垂直居中的情况，可能是部分android浏览器在对字体和行高大小的小数点取舍策略上的原因造成的，而ios在文字渲染上对小数点比较敏感，一般不会出现这个问题。

Answer 4

不要求兼容性的话，可以使用vh，或者给

html,body{
    height: 100%;
}

然后垂直方向使用百分比布局

Answer 5

Android对小数点后像素不敏感，有些会直接省略，所以通过JS动态计算出的有小数点的行高，基本会导致在Android上偏上或者偏下，比较粗暴的方式：给文字部分套一层table表格，不需要line-height，直接用表格的垂直居中实现

一定要用line-height，那你就自己拿真机慢慢手动调整了- -

Answer 6

一切以真机为主