rem是指相對于根元素(html)的字體大小的單位, 利用它能實現(xiàn)強大的屏幕適配布局。下面主要應用的是基于js去調整根元素字體大小, 從而實現(xiàn)各個尺寸屏幕的適配;


使用方法:
1.復制上面這段代碼到你的頁面的頭部的script標簽的最前面。
2.根據(jù)設計稿大小,調整里面的最后兩個參數(shù)值。
3.使用1rem=100px轉換你的設計稿的像素,例如設計稿上某個塊是100px*300px,換算成rem則為1rem*3rem。
注: html font-size字體大小 = 設備寬度 / (設計圖尺寸 / 100);
假設提供的設計稿為750PX的,那么:
deviceWidth = 320,font-size = 320 / 7.5 = 42.6666px
deviceWidth = 375,font-size = 375 / 7.5= 50px
deviceWidth = 414,font-size = 414 / 7.5 = 55.2px
deviceWidth = 500,font-size = 500 / 7.5 = 66.6666px
---------------------
作者:小白變怪獸
來源:CSDN
原文:https://blog.csdn.net/u013558749/article/details/78835980
版權聲明:本文為博主原創(chuàng)文章,轉載請附上博文鏈接!