不論裝置寬度是多少，統一把布局視口設定成設計稿的寬度。假設設計稿寬度是375px。
①.不管螢幕多大，都看作375px。width只能改變布局視口，不能改變視覺視口。
②.定義設計稿的寬度->計算當前裝置的寬度document.documentelement.offsetwidth->scale = 裝置寬度/設計搞寬度->獲取meta元素->設定meta中的content的inital-scale->meta.content = 『initial-scale=』+scale+』,maximum-scale=』+scale+』,minimum-scale=』+scale;
存在問題：沒有理想視口，的1x，2x都一樣了。
①.用meta標籤設定為理想視口。
html
此後的所有畫素都用rem表示，如果量出來是28px，換成rem就是.28rem。
用js設定根元素字型的大小，以適應不同的螢幕。
定義設計稿的寬度->計算當前裝置的寬度->scale = 裝置寬度/設計稿寬度->設定當前裝置下根元素的字型大小document.documentelement.style.fontsize = (100 * scale) + 『px』;
存在問題：理想視口還在，用100px精確計算可能有問題。
②.rem適配配合less
在less中定義@rem:375/12rem;如果量出來的是28px，就寫成28/@rem。
在html中引入css檔案，定義設計稿的寬度->計算當前裝置的寬度->scale = 裝置寬度/設計稿寬度->設定根元素字型大小fontsize ，用設計稿的寬度/12->設定當前裝置下根元素字型大小document.documentelement.style.fontsize = fontsize * scale + 『px』;
移動端適配
js適配方案 function resizefun else body removeclass hightscreen shortscreen portrait var ratio window width window height if screenstate portrait else if ...
移動端適配
無法對1px邊框的問題進行處理 裝置畫素比的問題 採用rem,px單位進行適配 使用js動態的計算當前的rem單位取值。即 1 rem px 假如設計稿的寬度為 750px 元素測量得到的寬度為 100px 那麼在視口寬度為 375px下 元素的寬度就變為 50 px 元素寬度從 px 單位轉為 r...
移動端適配
首先在head標籤裡加上meta而後再將寫好的指令碼引入即可 將下面 寫在乙個檔案中，在head中引用 function e,t function d var i t.documentelement,o e.devicepixelratio 1 if n d e.addeventlistener r...