电脑上做网站广告设计制作公司网站
目录
- 一、rem方案
 - 二、vw适配方案
 
一、rem方案
以vue2项目为例
- 下载安装包:npm install amfe-flexible --save
 - 在main.js中引入:import ‘amfe-flexible’
 - 下载安装包:npm install postcss-pxtorem --save
 - 项目下新建postcss.config.js文件,其中代码内容如下:
 
module.exports = {plugins: {'postcss-pxtorem': {rootValue: 75,  // 设计稿宽度的1/10,代表 1rem=75pxpropList: ['*'],  // 需要做转化处理的css属性  * 就是所有属性都要转换,如`hight`、`width`、`margin`等,`*`表示全部exclude: /node_modules/i,  // 这里表示不处理node_modules文件下的css}}
}
 
二、vw适配方案
以vue2项目为例:
- 安装插件:npm install postcss-px-to-viewport --save-dev
 
