Vue 移動端適配 amfe flexible

2022-07-05 23:51:13 字數 335 閱讀 2475

"amfe-flexible": "^2.2.1",

"postcss-px2rem": "^0.3.0",

外掛程式安裝

配置px轉rem

addpostcssplugins([require("postcss-px2rem")()]),

remunit是37.5,750px的設計稿就要除以2 來寫px單位

remunit是75,750px的設計稿就是1:1來寫px單位

參考:react移動端參考

如果直接引用  flexible.js  750px的設計稿: rem的換算是除以75就是rem的值

Vue移動端螢幕適配

第一步 在src路徑下新建乙個js資料夾,在建立乙個resize.js檔案 第二部 在resize.js檔案內寫入以下 function doc,win if doc.addeventlistener return domcontentloaded是firefox下特有的event,當所有dom解析...

vue 移動端適配vant

下面我們分別將這兩個工具配置到專案中完成 rem 適配。一 使用 lib flexible 動態設定 rem 基準值 html 標籤的字型大小 1 安裝 npm i amfe flexible2 然後在 main.js 中載入執行該模組 import amfe flexible 二 使用 postc...

移動端適配

js適配方案 function resizefun else body removeclass hightscreen shortscreen portrait var ratio window width window height if screenstate portrait else if ...