1.先引入一下js,到頭部的script標籤的最前面。
2..根據設計稿大小，調整裡面的最後兩個引數值。
3.使用1
rem=100px轉換你的設計稿的畫素，例如設計稿上某個塊是100px*300px,換算成
rem則為1
rem*3rem。
上面的**，如果在
uc瀏覽器下橫屏與豎屏轉換，發現**並沒有
自適應，則通過下面進行解決bug:
已經找到相容方案，可通過js在頁面的head裡生成定義了html元素font-size的style元素來解決！
如下：
注意還加了important來提高權重
//designwidth:設計稿的實際寬度值，需要根據實際設定
//maxwidth:製作稿的最大寬度值，需要根據實際設定
//這段js的最後面有兩個引數記得要設定，乙個為設計稿實際寬度，乙個為製作稿最大寬度，例如設計稿為750，最大寬度為750，則為(750,750)
;(function(designwidth, maxwidth) ';
}if (docel.firstelementchild) else
//要等 wiewport 設定好後才能執行 refreshrem，不然 refreshrem 會執行2次；
refreshrem();
win.addeventlistener("resize", function() , false);
win.addeventlistener("pageshow", function(e)
}, false);
if (doc.readystate === "complete") else , false);
}})(750, 750);
再次強調一下：·
需要根據你的設計稿的大小來調整指令碼最後的兩個引數。
})(750, 750);
自適應rem布局
自適應處理 假設 function doc,win if doc.addeventlistener return win.addeventlistener resizeevt,recalc,false doc.addeventlistener domcontentloaded recalc,fals...
rem自適應布局
使用rem實現自適應布局，應該算是當前移動前端的一大趨勢，有些人對此還有點迷惑，搞不懂rem是如何實現自適應布局，如何根據設計稿來調整rem的值？rem布局如何用雪碧背景？rem一定要載入js嗎？rem的根html font size設定為多少合適？看看這篇文章，也許能幫到你。目前有兩種，一種是根據...
自適應布局rem
百分比布局只能實現寬度自適應 高度無法自適應 高度也自適應 使用乙個新的單位rem rem root element 根元素 參照根元素的字型大小，是相對單位 預設html元素文字大小是16px 所以 1rem 16px 10rem 160px 原理 示例 window.onresize setht...