开发工具: 
    编辑器:vscode;
    css预处理器:less;(无具体要求);

步骤:
  1. vscode安装cssrem插件;




  2. 修改css插件的默认配置,其默认转换px为16px, 需要改为当前项目设计的1rem所对应的px,vscode插件的默认安装目录一般为 C:\Users\用户名\.vscode\extensions

找到 cipchk.cssrem-0.0.3  插件,打开package.json, 修改其默认配置:px;
font-family: Microsoft Yahei, Arial;
background: #f0f0f0;
font-size: 0.5rem;
margin: 0 auto !important;
/*滚动条卡顿*/
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}










让px单位自动转换为rem的方法的更多相关文章

  1. vue 自动px单位自动转换rem

    vue 适配移动端 假设设计图是375 第一步 安装 lib-flexible npm i lib-flexible --save 第二步 安装 px2rem-loader npm install p ...

  2. 自动把网页px单位转换成rem

    自动把网页px单位转换成rem 首先在你的项目开发环境中安装2个插件 然后在vue.config.js文件引入并重新启动服务器 这样就配置成功了,一起看看效果

  3. vue项目中px自动转换为rem

    .安装 postcss-pxtorem : npm install postcss-pxtorem -D .修改 /build/utils.js 文件 找到 postcssLoader const p ...

  4. vue换算单位px自动转换rem

    cnpm i postcss-px2rem --save cnpm install px2rem-loader --save 2.配置px2rem build目录下vue-loader.conf.js ...

  5. css3单位em,rem,px,vw,vh等

    昨天发现了个好用的方法去设置手机端的rem单位,在这里记录下. html{ font-size:calc(100vw/7.5);} 这是按照750的设计稿(也就是iphone6的设计稿). 100vw ...

  6. vue脚手架中使用Vant,实现自动按需引入组件,并将px转换为rem

    偶然间看到一款不错的移动端vue组件库Vant,照着官方文档敲了一下,感觉还是不错的.想着以后的项目中可能会运用到,特此记录下,方便之后使用. 现在很多的组件库为了减小代码包体积,都支持按需加载了.V ...

  7. px-rem px转换为rem的工具

    将px转换为rem的工具,github地址:https://github.com/finance-sh/px-rem 将px转换为rem的工具 怎样转换静态文件 安装: npm install px- ...

  8. px-rem 一个将px转换为rem的工具

    将px转换为rem的工具,github地址:https://github.com/finance-sh/px-rem 怎样转换静态文件 安装: npm install px-rem -g 然后跑下命令 ...

  9. vue px转换为rem

    前端开发中还原设计图的重要性毋庸置疑,目前来说应用最多的应该也还是使用rem.然而很多人依然还是处于刀耕火种的时代,要么自己去计算rem值,要么依靠编辑器安装插件转换. 而本文的目标就是通过一系列的配 ...

随机推荐

  1. PHP引用是什么?

    引用是什么 在 PHP 中引用意味着用不同的名字访问同一个变量内容.这并不像 C 的指针,替代的是,引用是符号表别名.注意在 PHP 中,变量名和变量内容是不一样的,因此同样的内容可以有不同的名字.最 ...

  2. RK3288 make otapackage 出错的问题【转】

    本文转载自:http://blog.csdn.net/u010439962/article/details/51734631 Installed file list: out/target/produ ...

  3. website项目的reference问题

    right click on website project--> property pages dll dependency Check the type column,if you have ...

  4. AutoIT:为文件夹下面的文件批量改名

    以前用Ruby脚本,对于中文,数字结合的文件名,修改名字也不是非常简单,需要修改字符集,可是用autoit来实现,也挺简单的,并且可以替换已有文件名中的汉字部分. $filepath = " ...

  5. JAVA JVM 流程二

    作为一名Java使用者,掌握JVM的体系结构也是必须的.说起Java,人们首先想到的是Java编程语言,然而事实上,Java是一种技术,它由四方面组成:Java编程语言.Java类文件格式.Java虚 ...

  6. python中coding:utf-8和setdefaultencoding区别

    这两个作用不一样, 1. # coding:utf-8 作用是定义源代码的编码. 如果没有定义, 此源码中是不可以包含中文字符串的.PEP 0263 -- Defining Python Source ...

  7. Java-Runoob-高级教程-实例-字符串:12. Java 实例 - 字符串优化

    ylbtech-Java-Runoob-高级教程-实例-字符串:12. Java 实例 - 字符串优化 1.返回顶部 1. Java 实例 - 字符串优化  Java 实例 以下实例演示了通过 Str ...

  8. Java-Runoob-高级教程-实例-字符串:11. Java 实例 - 字符串性能比较测试

    ylbtech-Java-Runoob-高级教程-实例-字符串:11. Java 实例 - 字符串性能比较测试 1.返回顶部 1. Java 实例 - 字符串性能比较测试  Java 实例 以下实例演 ...

  9. poj 3130 How I Mathematician Wonder What You Are! 【半平面交】

    求多边形的核,直接把所有边求半平面交判断有无即可 #include<iostream> #include<cstdio> #include<algorithm> # ...

  10. 解决Bad owner or permissions on .ssh/config 的问题

    在使用gei fetch 或者 sftp的时候,出现 Bad owner or permissions on .ssh/config的问题的解决办法 修改.ssh/config的权限: sudo ch ...