現在手機螢幕解析度越來越多，為了適應螢幕不同大小，我們首先要做到的便是頁面布局自適應。
當然解決方案很多，比如：百分比布局，彈性布局flex，也都能獲得不錯的效果，這裡主要介紹的是本人在實踐中用的最高效的布局方案——rem布局
一，設定初始的rem值
用js計算來實現rem，只需要全域性引入下面這段原生js**即可
二， 全域性使用"rem"來代替"px"
由於rem是相對於根節點元素大小的單位，故當裝置寬度改變時，採用rem布局的大小均會跟隨相同比例變化，從而實現整體縮放。
注意：為更好的實現自適應布局，全域性最好少出現（或不出現）用"px"的情況，全部使用"rem"。
移動端頁面使用rem來做適配
以前我們往往這樣做頁面 viewport width 設定為 device width，然後選我們需要相容裝置的最小寬度 一般是320px 根據這最小寬度來做頁面。單位使用px和百分比。在寬度不同的裝置上，頁面的字型大小，內容尺寸都是一樣的，不同的是，大屏的內容間的空隙比小屏的大。所以這樣做的缺點就...
移動端rem使用
1 移動端設計圖750時，html font size 50px。使用方法 1 新增viewport。2 在頁面最裡面引入該段js 建議在head裡面引入 3 css 的編寫，設計圖為750px時，頁面標註大小除以100即可，例如 設計圖標註的是，寬300px,高300px。使用rem就是，widt...
vue 專案設定移動端rem
第一種直接設定 fnresize window.onresize function function fnresize 禁止雙擊放大 document.documentelement.addeventlistener touchstart function event false var lastt...