頁面中使用的rem單位是相對於』html』這個根節點的作為參考，預設的情況下html的字型大小16x,在什麼也不做處理的情況下，頁面中如果使用了rem，那麼這時候的1rem表示的就是1*16 = 16px; 2rem表示的就是32px的大小；在寫手機端頁面時封裝的rem自適應js檔案如下：
//這個js裡面設定rem實現自適應的布局，1rem = 100px；
(function
(doc, win) else
};if (!doc.addeventlistener) return;
win.addeventlistener(resizeevt, recalc, false);
doc.addeventlistener('domcontentloaded', recalc, false);
})(document, window);
script>
關於rem布局的理解
將頁面的 設計稿等比例的進行縮放 首先是計算視覺稿到頁面的比例 假設這個比例是a a 視覺稿的寬度 頁面的寬度 document.documentelement.clientwidth 根據這個比率去計算 螢幕上應該顯示的寬度 假設這個值是 b b 量取的寬度 a 現在我們獲取了元素在螢幕上顯示的乙...
關於rem布局
我們知道，當使用rem布局，並配合js動態按照比例設定html標籤上的rem值時，整個頁面是按照螢幕的寬度來整體縮放的。對於高度不限制的頁面 也就是超出一屏頁面可以滾動 這種方案沒有任何問題，簡單暴力。但是對於一些需要布滿一整屏的頁面 比如現在流行的上下 左右滑動的那種 由於乙個頁面的元素必須在乙個...
關於rem布局摘錄
一般情況下使用em或者rem的時候，會寫個樣式 html,body html，這樣設定方便了em rem與px相互轉換，因為瀏覽器預設字型大小16px，所以em的初始值為1em 16px。當設定了body時，1em則 16px 62.5 10px。但是由於谷歌不相容，所以我個人習慣使用 html。目...