>rem單位：
根標籤的font-size所代表的值
>步驟
1.建立style節點
2.獲取視覺視口寬度/16（避免 出現小數丟失精度），
當width=device-width時，用布局視口寬度代替，無相容性問題
3.style節點中設定html的font-size，並且宣告!important
4.將style節點新增到head標籤內
>原理
改變乙個元素在不同裝置上的css畫素的個數
>優缺點
優點：可以使用完美視口
缺點：px到rem的轉化特別麻煩
>步驟
將所有裝置的布局視口的寬置為設計圖的寬度
建立meta標籤
第一步 定義設計圖的寬度
第二步 確定系統縮放比例
第三步 選中viewport標籤，改變其content值
>原理
改變不同裝置上乙個css畫素跟物理畫素的比例
>優缺點
優點：所量即所得
缺點：破壞了完美視口
百分比參照於誰流體(彈性布局 flex)+固定 (不是適配)
移動端適配
js適配方案 function resizefun else body removeclass hightscreen shortscreen portrait var ratio window width window height if screenstate portrait else if ...
移動端適配
不論裝置寬度是多少，統一把布局視口設定成設計稿的寬度。假設設計稿寬度是375px。不管螢幕多大，都看作375px。width只能改變布局視口，不能改變視覺視口。定義設計稿的寬度 計算當前裝置的寬度document.documentelement.offsetwidth scale 裝置寬度 設計搞寬...
移動端適配
無法對1px邊框的問題進行處理 裝置畫素比的問題 採用rem,px單位進行適配 使用js動態的計算當前的rem單位取值。即 1 rem px 假如設計稿的寬度為 750px 元素測量得到的寬度為 100px 那麼在視口寬度為 375px下 元素的寬度就變為 50 px 元素寬度從 px 單位轉為 r...