h 5携帯端末適応ソリューション

現在、携帯電話側のプロジェクトが多く、適応はもちろん必須スキルであり、現在のアプリケーションの単位はremが最も多く、
しかし、制作のたびにrem値を自分で計算する必要があるのは煩雑で、postcss-pxtoremの使用を共有することでpxを直接remに変換することができ、計算の体力を節約することができます.
   まずインストール依存 

npm install postcss-pxtorem -D

      
 package.json     ，    

"postcss": {
  "plugins": {
    "autoprefixer": {},
    "postcss-pxtorem": {
      "rootValue": "72",//           ，       720 
      "propList": [ //           rem propList ['*']

 　　　　"padding", .....

      ]
    }
  }
},
    flexrem.js             

(function(doc, win) {

    var docEl = doc.documentElement,

        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', //           rem

        recalc = function() {

            var clientWidth = docEl.clientWidth;
            if(clientWidth > 750){//         750
                clientWidth = 750
            }
            if (!clientWidth) return;

            docEl.style.fontSize = (clientWidth / 10) + 'px';

        };

    if (!doc.addEventListener) return;

    win.addEventListener(resizeEvt, recalc, false);

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

})(document, window);

転載先:https://www.cnblogs.com/jeremy-o/p/11344983.html