解决iphone6上的rem适配问题及字体被变成宋体的问题

js判断系统添加标识

if (/iP(hone|od|ad)/.test(window.navigator.userAgent)) {
		

        /* 添加IOS标识 */

        doc.documentElement.classList.add('ios');

        /* IOS8以上给html添加hairline样式，以便特殊处理 */

        if (parseInt(window.navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/)[1], 10) >= 8)

            doc.documentElement.classList.add('hairline');

    }
复制代码

我以前是这样写的字体样式font-family:"Microsoft Yahei" !important;iphone上面他喵的不识别没有生效因而就只有这样

font-family: "微软雅黑" !important;
复制代码

下面是完整的remjs代码须要用的时候引入便可

!function (window) {

/* 设计图文档宽度 */

var docWidth = 750;

var doc = window.document,

    docEl = doc.documentElement,

    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';



var recalc = (function refreshRem () {

    var clientWidth = docEl.getBoundingClientRect().width;

    /* 8.55：小于320px再也不缩小，11.2：大于420px再也不放大 */

    docEl.style.fontSize = Math.max(Math.min(20 * (clientWidth / docWidth), 11.2), 8.55) * 5 + 'px';

    return refreshRem;

})();



/* 添加倍屏标识，安卓倍屏为1 */

docEl.setAttribute('data-dpr', window.navigator.appVersion.match(/iphone/gi) ? window.devicePixelRatio : 1);



if (/iP(hone|od|ad)/.test(window.navigator.userAgent)) {
	

    /* 添加IOS标识 */

    doc.documentElement.classList.add('ios');

    /* IOS8以上给html添加hairline样式，以便特殊处理 */

    if (parseInt(window.navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/)[1], 10) >= 8)

        doc.documentElement.classList.add('hairline');

}



if (!doc.addEventListener) return;

window.addEventListener(resizeEvt, recalc, false);

doc.addEventListener('DOMContentLoaded', recalc, false);



}(window);
复制代码