vue3 0 PC端自適應不同解析度電腦

首先我們需要要安裝一些依賴

npm i lib-flexible-computer -

s//根節點會根據頁面視口變化而變化font-size大小
npm i px2rem-loader -
d//自動將px轉換為rem
npm i postcss-px2rem//將**中px自動轉化成對應的rem的乙個外掛程式

npm i lib-flexible -

s

廢話不多說

下面進入正題

安裝好依賴怎麼使用

在main.js中引入

import

"lib-flexible-computer"
;

並在此檔案中加入以下**

module.exports =

, postcss:)]
}}}}
;

注：**

這裡面說的vue3.0是vue cli 3.0 因為3.0之後沒有build資料夾了所以需要上面這樣做

vue3.0版本和vue2.6.1的版本用上面這個方法也是可行了

Vue實現PC端解析度自適應

方案 安裝依賴npm install px2rem loader d npm install lib flexible s引入依賴import lib flexible px轉換成rem vue loader的options和其他樣式檔案loader最終是都是由build utils.js裡的方法生...

移動端PC端自適應

查詢 這段 的幾個引數解釋 width device width 寬度等於當前裝置的寬度 initial scale 初始的縮放比例 預設設定為1.0 minimum scale 允許使用者縮放到的最小比例 預設設定為1.0 maximum scale 允許使用者縮放到的最大比例 預設設定為1.0 ...

PC端自適應使用rem

做乙個pc端的網頁，設計圖是1920x1080，要在常見屏上顯示正常 比如 1280x720 1366x768 1440x900 1920x1080。就要使用rem，width height margin padding left top都採用了rem,注意 html的font size設定的為10...