vue中使用rem布局

**

使用的是vue-cli4

方式一：

在public下的index.html頁面中新增如下js

fnresize();

window.onresize = function () 
function fnresize() 
if (devicewidth <= 320) 
document.documentelement.style.fontsize = (devicewidth / 7.5) + 'px';
}

然後在寫css就可以將px單位換成rem.

這裡設定的比例是100px=1rem,
例如:寬度為100px時,可以直接寫成1rem

首先安裝amfe-flexible外掛程式，在main.js裡引入

1、npm i amfe-flexible

2、import 'amfe-flexible'

npm i postcss-px2rem

"postcss": ,

"postcss-px2rem": 
}}

vue 中使用rem布局

在用vue或react等工具搭建乙個移動端專案時,怎樣做到自適應呢?當然選擇rem布局比較方便快捷.此處已vue為例,在使用vue cli搭建好專案框架後,在目錄結構的index.html檔案中新增一段js fnresize window.onresize function function fnr...

vue 中使用rem布局

一.在使用vue cli搭建好專案框架後,在目錄結構的index.html檔案中新增一段js fnresize window.onresize function function fnresize if devicewidth 320 document.documentelement.style.f...

vue 專案使用 rem 布局

使用 vue cli 構建專案完成後，在index.html檔案內新增如下 相容uc豎屏轉橫屏出現的bug 自定義設計稿的寬度 designwidth 最大寬度 maxwidth 這段js的最後面有兩個引數記得要設定，乙個為設計稿實際寬度，乙個為製作稿最大寬度，例如設計稿為750，最大寬度為750，...