网站配色 原则,app介绍模板,电影院网站建设方案,广州网站建设招标以下方法为px自动转换rem#xff0c;顾名思义#xff0c;配置完成后#xff0c;不用再关心rem换算等等#xff0c;只需按照设计稿的px值写入即可#xff0c;当你保存后PostCSS插件会自动将px转换成所配置的rem值#xff0c;并且你在浏览控制台观测界面时你会发现你在代码…以下方法为px自动转换rem顾名思义配置完成后不用再关心rem换算等等只需按照设计稿的px值写入即可当你保存后PostCSS插件会自动将px转换成所配置的rem值并且你在浏览控制台观测界面时你会发现你在代码里写的是px单位在控制台被转换成了rem单位。
postcss 一种对css编译的工具本身不会对css一顿操作它通过插件实现功能。1. 使用amfe-flexible postcss-pxtorem包实现px自动转换rem 1.首先下载需要的npm包
npm i amfe-flexible
npm install postcss-pxtorem -D
该插件不能转换行内样式中的 px例如 div stylewidth: 200px;/div
2 对文件进行额外的配置
首先在mian.js引入amfe-flexible
import amfe-flexible3.在与src文件夹平级区域创建一个为.postcssrc.js的文件
对.postcssrc.js文件进行额外配置autoprefixer 是一个自动添加浏览器前缀的 PostCss 插件browsers 用来配置兼容的浏览器版本信息但是写在这里的话会引起编译器警告。因为 VueCLI 内部已经配置了 autoprefixer 插件。
module.exports {plugins: {postcss-pxtorem: {rootValue: 37.5,propList: [*]}}}
转载Vue中使px自动转rem配置使用第三方包|| 用js配置Vscode扩展处理适配问题 - 简书 (jianshu.com)
